surveyjs / survey-library

Free JavaScript form builder library with integration for React, Angular, Vue, jQuery, and Knockout.
https://surveyjs.io/form-library
MIT License
4.21k stars 814 forks source link

Dropdown - Activate a list of options only after a user enters more than the specified number of characters #5791

Closed JaneSjs closed 5 months ago

JaneSjs commented 1 year ago

In the meantime, a Dropdown activates a drop-down list and starts searching for possible matches as long as users start typing in the search box.

To enhance the user experience, it is recommended to implement a minimum search character count for Dropdown questions. This feature will ensure that the Dropdown only starts searching for items once users have entered a specific number of characters, such as three. This approach will prevent the Dropdown from unnecessarily searching through a large list of items and will improve the search speed and accuracy. By implementing this feature, users can more efficiently navigate through the Dropdown menu and quickly find the desired item. Therefore, introducing a minimum search character count can significantly improve the overall usability of the Dropdown feature.

Original inquiry: T12379 - Dropdown - Activate a list of options only after a user enters more than the specified number of characters.

JaneSjs commented 5 months ago

+1 https://surveyjs.answerdesk.io/internal/ticket/details/T18466

I don't need to limit the number of characters for making a request, I need to debounce the request (more context here regarding "debounce" https://dev.to/manishkc104/debounce-input-in-react-3726) I tried to implement the debounce inside onChoicesLazyLoad event handler but that's where I get unexpected results with old values of the filter string… It would be nice that SurveyJS supports debouncing the lazy load event For that it would need to provide a way to customize the debounce time (similar you do for the page size for the lazy load configuration)… So if you configure something like debounceTime: 1000 it means "onChoicesLazyLoad will be triggered after the user stops typing for 1000 miliseconds" (and of course with the last value of the input filter which is what I couldn't achieve with a custom debounce logic)