harsh-harlequin•4mo ago

Useselect Disable Api call When Changes

<Select
showSearch={false} style={{ width: 150 }} placeholder="Firms" onSearch={undefined}
onChange={undefined} searchValue={""} {...firmSelect} /> it still do api calls. How can I disable api call. I want it to search locally

3 Replies

kapa.ai•4mo ago

Hi @CVas. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- To disable the API call and enable local search using useSelect, you need to set the onSearch function to undefined and manage the search value locally. This will ensure that the filtering is done on the client-side rather than making an API call. Here is an example of how you can achieve this:

import { useSelect } from "@refinedev/antd";
import { Select } from "antd";
import { useState } from "react";

const FirmSelect: React.FC = () => {
  const { selectProps } = useSelect({
    resource: "firms",
  });

  const [searchValue, setSearchValue] = useState("");

  return (
    <Select
      showSearch={false}
      style={{ width: 150 }}
      placeholder="Firms"
      onSearch={undefined}
      onSearchChange={setSearchValue}
      searchValue={searchValue}
      {...selectProps}
    />
  );
};

import { useSelect } from "@refinedev/antd";
import { Select } from "antd";
import { useState } from "react";

const FirmSelect: React.FC = () => {
  const { selectProps } = useSelect({
    resource: "firms",
  });

  const [searchValue, setSearchValue] = useState("");

  return (
    <Select
      showSearch={false}
      style={{ width: 150 }}
      placeholder="Firms"
      onSearch={undefined}
      onSearchChange={setSearchValue}
      searchValue={searchValue}
      {...selectProps}
    />
  );
};

In this example: - onSearch is set to undefined to disable server-side filtering. - onSearchChange and searchValue are used to manage the search input locally. This setup ensures that the search is performed locally without making any API calls. For more information, you can refer to the client-side filtering section (https://refine.dev/docs/ui-integrations/mantine/hooks/use-select/#onsearch) in the documentation. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•4mo ago

<@334335533809664010> kapa.ai is still learning and improving, please let us know how it did by reacting below

harsh-harlequinOP•4mo ago

It still do api calls

Useselect Disable Api call When Changes

Did you find this page helpful?