Wednesday, November 22, 2017

Semantic UI autocomplete responses arrive out of order

Leave a Comment

I am using the following Semantic UI autocomplete dropdown:

$('.ui.dropdown').dropdown({     minCharacters: 1,     apiSettings: {         url: '/api/people?q={query}'     } }); 

It works, except that when I type 'abc' the responses from my server are returned in the order 'abc', 'ab', 'a' and so the final rendered result is the set of suggestions for 'a', while the field contains 'abc'.

Does Semantic UI provide a standard way to deal with this problem or do I need to implement a fix manually?

2 Answers

Answers 1

The solution would be to cancel previous request whenever new request is made. Semantic UI provides a flag for this (interruptRequests).

$('.ui.dropdown').dropdown({      minCharacters: 1,      apiSettings: {          url: '/api/people?q={query}',          interruptRequests: true      }  });

Ref: https://github.com/Semantic-Org/Semantic-UI/blob/master/RELEASE-NOTES.md

Search for interruptRequest in above link.

Answers 2

You can use match attribute

When using search selection specifies how to match values.

both Matches against text and value

value matches against value only

text matches against text only

The default setting is both

If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment