Minimum Input Length not working?

[bgadiel]

Bug description:

I have ~1500 items in my drop down list in bootstrap modal.
When I show all the items in a drop down list, there is a delay of 2 seconds for every action the user does.
When trying to limit the amount of items to show by using 'minimum-input-length', there is no change (i.e - full list is displayed).
I tried debugging 'ctrl.activate' function in select.js and I noticed that in line 393 there is different behavior when comparing to Multiple Selection's Plunker:
Line 393: 'if (ctrl.$animate && ctrl.$animate.on && ctrl.$animate.enabled(container[0]))'
On official Multiple's (exmaple:) 'ctrl.$animate.enabled(container[0])' returns undefined, therefore, continues to line 415 $timeout.
On my app: 'ctrl.$animate.enabled(container[0])' returns true and then shows the drop-down list.

My HTML Markup:

<ui-select multiple ng-model="vm.salesPlayContent.mapped_markets" theme="select2" style="width: 630px;" title="select market">
                    <ui-select-match placeholder="Select market...">{{ $item.name }}</ui-select-match>
                    <ui-select-choices repeat="market in vm.salesPlayContent.available_markets | filter: {name: $select.search}" minimum-input-length="4">
                        <div ng-bind-html="market.name | highlight: $select.search"></div>
                    </ui-select-choices>
                </ui-select>

Versions

Angular: 1.4.5

UI-Select / select.js: 0.17.1

Angular UI-Select: 0.18.0

Bootstrap/Select2/Selectize CSS (if applicable):
Select2: 3.5.4
select2-bootstrap-css: 1.4.6
Selectize: 0.12.1

[user378230]

Your plunkrs are empty 😞 did you try in v0.18.0?

[bgadiel]

Not sure why function 'enabled' returns 'true' on my app and in the examples its undefined.
I'll try 0.18 as well.

[bgadiel]

Version 0.18.0 does not change anything.
Working Plunkr for my problem:
https://plnkr.co/edit/H0kbeR4kHfZFjsBnpjBC?p=preview

Notice the laggish UI behavior and how the UI freezes frequently when trying to select an option from the list.
Thank you.

[user378230]

Oh, you aren't using the refresh functionality though:

option	description	value
minimum-input-length	Minimum characters required before refresh function is triggered	integer (or interpolated expression: {{ 1 + 1 }})

(Wiki: https://github.com/angular-ui/ui-select/wiki/ui-select-choices)

If you want to extend this to cover already retrieved data, I think the problem was caused by the $watchCollection on the repeat return value, triggering refreshItems. See here

[bgadiel]

Could you be more specific how I should use it please?
Didnt see it being used on AngularJS ui-select's Plunkr example.

[user378230]

Basic Demo (first ui-select)

[bgadiel]

The example shows using GET on refresh. I don't use GET as I already have all the data in 'items'.
Could you please help modifying my plunker so it will use min-characters correctly?

[bgadiel]

Is the performance issue related to ng-repeat creating too many watchers?

[Jefiozie]

I think this is the same issue as we have on stackoverflow.
Let us continue here with the discussion?

Stackoverflow Link

[bgadiel]

sure.
I am not sure how to fix my issue.
So at the monent I am thinking of switching to diff library.
If you have any ideas how to fix, I would love to try them out.
Thanks,
Gideon
בתאריך 29 ביוני 2016 5:13 אחה״צ,‏ "J.Bosch" [email protected] כתב:

I think this is the same issue as you have on stackoverflow.
Let us continue here with the discussion?

Stackoverflow Link
http://stackoverflow.com/questions/38077516/slow-behaviour-of-angular-ui-selects-drop-down-list-when-big-list-of-items-in-m

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
#1682 (comment),
or mute the thread
https://github.com/notifications/unsubscribe/AKc-1Vv5W2bw8AZ02eyTNRnwn4xa9So1ks5qQn2TgaJpZM4I8sRq
.

[Jefiozie]

A possible way forward with the performance is to load +/- 25 items and when the user start searching lookup the value in the complete list of 1500+. Second I think I have seen some comments that track by $index will help (don't know for sure).

On the min length maybe have a look at #274 or maybe @user378230 has a idea.

[Jefiozie]

@bgadiel Did you already had a fix/ workaround for the min-length?

[rafaelhz]

I solved that using a LimitTo, checking the search length:

limitTo: ($select.search.length <= 2) ? 0 : undefined"

<ui-select-choices 
  repeat="item in ctrl.items | filter: $select.search | limitTo: ($select.search.length <= 2) ? 0 : undefined">
  ...
</ui-select-choices>

[bgadiel]

Great work!
בתאריך 12 ביולי 2016 5:04 אחה״צ,‏ "Rafael Zeffa" [email protected]
כתב:

I solve that using a LimitTo, checking the search length:

limitTo: ($select.search.length <= 2) ? 0 : undefined"

...

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#1682 (comment),
or mute the thread
https://github.com/notifications/unsubscribe/AKc-1aWhKvrFBObum84DtFEg3QiwYWGyks5qU57LgaJpZM4I8sRq
.

[Jefiozie]

@bgadiel issue can be closed as you have a answer?