ddl opens when filtering after searching

[Frederic]

Hi, I try to make dropdownlist create less "DOM" components to keep our app fast, even with lots of dropdown loaded with 100-1000 items.

So, I found that simple quick solution that works very well, I filter data on open / close to release "dom" items when I don't need them.

But, I have an issue when I apply a "contains" search.

Look at this

https://dojo.telerik.com/@foxontherock/OciGurUy/3

Open the combo, search for "trois" using the dropdown search box, then select it.

You will see, the combo re-opens, immediately when I apply the filter on the "filterOnValue" function.

If I don't set any "contains" search, it works well.

*** may I suggest to use that "DOM-trick" using filter on open-close the default behavior for all your components?  We plan to use it in dropdown, treeview, ...

We tried using "virtual", but there's too my bugs with it it never works as expected and it's too complicated. 

[Misho]

Hello,

Thank you for contacting us. I was able to replicate the reopening behavior in your customization of DropDownList. I also saw that you have the following filterOnValue handler:

var filterOnValue = _.debounce(function(){
          console.log("filterOnValue");
          ds.filter({ field: "id", operator: "eq", value: this.value() });
          // filter re-open if current "contains" is applied
          // kddl.close(); // hack, close after open
        }, 250);

The combo reopens immediately when the filterOnValue function is called with a filter previously applied.I've removed the usage of underscore and this behavior doesn't reproduce. Here is a sample of my test:

https://dojo.telerik.com/AdecArOn/2

I hope this helps.

Best Regards,
Misho
Progress Telerik

[Frederic]

Thank you, I see that it works when I don't set delay in my function.  But, I need it because it can contains 1000-2000 items, and be called by "change", "select", or "close" events, and I don't want to re-do that filtering 3-4 times in a row.

I tried something else... and I don't understand.

If I wait for 1000 ms to call the filtering, "from" the close event, it always re-open, even if I set a 5 seconds delay.

But, if do exactly the same thing, but by clicking a button I don't have the problem!  Exactly the same code with the same delay.  Only difference, something seems to still be attached in the call stack I suppose.

What is this?

https://dojo.telerik.com/@foxontherock/IpOkeCEp/2

 

[Misho]

Hi,

It looks lie the problem is reproducible when the focus remains on the filtered item. Here is a dojo sample with a suggestion to trigger focusOut from the dropdown wrapper and the filter input which solves the undesired reopening of the dropdown:

 setTimeout(function() { 
            e.sender.wrapper.trigger("focusout");          			     
          	e.sender.filterInput.trigger("focusout");
            doFilter(); 
          }, 1000)

I hope this helps 

Best Regards,
Misho
Progress Telerik