equal-aqua•12mo ago

How to transform a value before it gets sent for a resource update

Hi all! As the title states, I would like to know what the best practice is for transforming a value before it gets sent to the server to update a resource. Code:

export const ArtistEdit: React.FC<IResourceComponentsProps> = () =>  {
  const { formProps, saveButtonProps, queryResult } = useForm();
  const artistsData = queryResult?.data?.data;

  return (
    <Edit saveButtonProps={saveButtonProps}>
      <Form.Item
          label="Date Of Birth"
          name={["date_of_birth"]}
          rules={[
            {
              required: true,
            },
          ]}
          getValueProps={(value) => ({
            value: value ? dayjs(value) : undefined,
          })}
        >
          <DatePicker />
        </Form.Item>
    </Edit>

  )

}

export const ArtistEdit: React.FC<IResourceComponentsProps> = () =>  {
  const { formProps, saveButtonProps, queryResult } = useForm();
  const artistsData = queryResult?.data?.data;

  return (
    <Edit saveButtonProps={saveButtonProps}>
      <Form.Item
          label="Date Of Birth"
          name={["date_of_birth"]}
          rules={[
            {
              required: true,
            },
          ]}
          getValueProps={(value) => ({
            value: value ? dayjs(value) : undefined,
          })}
        >
          <DatePicker />
        </Form.Item>
    </Edit>

  )

}

In this code sample, I need to make sure the value of date_of_birth conforms to the backends requirement for date parsing. What is best practice here to do when working solely with refine?

3 Replies

Omer•12mo ago

@kapa.ai

inland-turquoise•12mo ago

Hey @derekdoes there is a section in our documentation on this subject. You can take a look here. https://refine.dev/docs/faq/#how-can-i-change-the-form-data-before-submitting-it-to-the-api

FAQ | refine

How can I change the form data before submitting it to the API?

equal-aqua•12mo ago

Thank you for the response! I’ll give it a go in a bit