Empty toolbar search fires"refresh" action when it looses focus

[Vicente]

Hi,

If i click in & out of the toolbar search input, it fires the refresh action, reloading the data. This causes a strange effect because fields with a template dissappears and appears again.

I'm not pressing "enter" (in this case the refresh action is desiderable) , i'm just "clicking" out the input control, loosing focus.

But.. If after that, i perform a real "Search", and later, i clear again the search input textbox, returning to the default state,  it doesn't fire again the refresh action when it loose the focus. That i think is the correct behavior if the text box is empty and i don't press "enter"

I've attached some console captures

Is it the expected behavior? Am i doing something wrong?

Thanks in advance

Attachment: captures_5373af03.zip

[Vikram Sundararajan]

Hi Vicente,

Greetings from Syncfusion support,

We understand that you are facing an issue where the toolbar search input triggers a "refresh" action when losing focus. We have created a sample to replicate the reported behavior, but we were unable to reproduce the issue. In our tests, clicking inside the search toolbar input and then clicking outside did not trigger the refresh method.

We noted that you mentioned if you perform a real search and then clear the search input textbox, the refresh action does not fire again when losing focus. This behavior seems correct, as it is expected that an empty search textbox does not trigger a refresh.

Please refer to the sample and video demo for further information.

Sample: https://stackblitz.com/edit/react-yzsrp1-bpz7ji?file=index.js,package.json

Video demo: searching_focus

We recommend using the provided sample as a reference to resolve the issue. If the issue persists, please provide the following details for further validation:

1. Could you please share the specific version of the Syncfusion Grid that you are using?
2. Try replicating the issue in the sample we shared.
3. Please clarify any customizations or additional settings you are using in your toolbar search logic.

Regards,

Vikram S

Attachment: searching_focus_63ce94f9.zip

[InfiWebs]

Hi Vikram,

I was facing this issue also, and was able to replicate the same on the demo you provided by adding 

loadingIndicator={{ indicatorType: 'Shimmer' }}

to the GridComponent.

Is there any option to disable the refresh on blur or perform search only when search submit is performed?

[Aishwarya Rameshbabu]

Hi Vicente,

Despite setting the loadingIndicator with the indicatorType as Shimmer, we were unable to replicate the issue using our shared sample. Please refer to the attached video demonstration and the updated sample below. The refresh action did not occur when the toolbar search input lost focus, even with the shimmer effect applied.

Sample: https://stackblitz.com/edit/react-yzsrp1-syhnnf?file=index.js,package.json

If the issue persists, we would greatly appreciate your assistance by providing the following details, which will help us identify the root cause and tailor a solution to your specific scenario:

1. Video Demonstration

Kindly share a video of the issue occurring in your application. Highlight the following:

• Steps you take to reproduce the refresh behavior on blur of the search input.
• Any specific observations (e.g., shimmer loading, template columns disappearing momentarily).

2. State Management

Let us know if you are dynamically updating any Grid properties using React state variables. In particular:

• Are state variables triggering frequent re-renders of the Grid?
• Are you updating the data source or columns dynamically in the Grid?

3. Complete Code

Please share the full code used to render the Grid in your application. Specifically:

• Event handler implementations.
• Definitions for template columns or any custom rendering logics used.

4. Package Version

Specify the exact version of the Syncfusion React package you are currently using.

Regards

Aishwarya R