Skip default request on EDIT page when I use useForm

How Skip default request on EDIT page when I use useForm

5 Replies

Hi @Evgeny Kutovoy. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- To skip the default request on the EDIT page when using useForm, you can use the queryOptions.enabled property set to false in the refineCoreProps of the useForm hook. This will disable the automatic data fetching that normally occurs on the edit page. Here's how you can implement this:

useForm({
  refineCoreProps: { 
    queryOptions: { enabled: false } 
  },
  // ... other options
})

useForm({
  refineCoreProps: { 
    queryOptions: { enabled: false } 
  },
  // ... other options
})

By setting enabled: false, you prevent the default request from being made. This is particularly useful when you want to handle data fetching manually or when you want to populate the form with data from a different source. You can find more information about this in the useForm documentation. If you need to fetch data manually after disabling the default request, you can use the defaultValues property with an async function to fetch and return the initial form data:

useForm({
  defaultValues: async () => {
    const response = await dataProvider.getOne({
      resource: "posts",
      id: 2,
    });
    return response.data;
  },
  refineCoreProps: { queryOptions: { enabled: false } },
})

useForm({
  defaultValues: async () => {
    const response = await dataProvider.getOne({
      resource: "posts",
      id: 2,
    });
    return response.data;
  },
  refineCoreProps: { queryOptions: { enabled: false } },
})

This approach allows you to have full control over when and how the data is fetched for your edit form. useForm documentation ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2w ago

<@760427134384209950> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

stormy-goldOP•2w ago

but if I need manual? @kapa.ai If I need manual?

kapa.ai•2w ago

Let me check the knowledge base for you again. One moment! :books: ---------------------- If you need manual control over when and how data is fetched for your edit form, you can indeed use the approach I mentioned earlier. However, there's also a specific "manual" mode available in refine for handling real-time data, which might be what you're asking about. Let me explain both options: 1. For manual control of data fetching in edit forms: You can use the queryOptions.enabled: false property in useForm to disable automatic data fetching, and then use defaultValues with an async function to manually fetch and set the initial form data. This gives you full control over the data fetching process. 2. For manual handling of real-time updates: Refine offers a "manual" mode for handling real-time data updates, which is particularly useful in edit pages to prevent synchronization problems caused by multiple editing sources. This is done using the liveMode: "manual" option in useForm. Here's an example of how you can implement this:

const { formProps, saveButtonProps, query } = useForm<IPost>({
  liveMode: "manual",
  onLiveEvent: (event) => {
    if (event.type === "deleted" || event.type === "updated") {
      setDeprecated(event.type);
    }
  },
});

const { formProps, saveButtonProps, query } = useForm<IPost>({
  liveMode: "manual",
  onLiveEvent: (event) => {
    if (event.type === "deleted" || event.type === "updated") {
      setDeprecated(event.type);
    }
  },
});

In this mode, instead of automatically updating the form data when real-time changes occur, you'll be notified about the changes and can handle them manually. This allows you to show alerts or take other actions without immediately changing the data the user is editing. You can find more details about this approach in the Configuring liveMode documentation. Both of these methods give you manual control, but they serve different purposes. The first is about controlling initial data fetching, while the second is about handling real-time updates during editing. Choose the one that best fits your specific use case. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2w ago

<@760427134384209950> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Skip default request on EDIT page when I use useForm

Did you find this page helpful?