How to update data source and binded value when pop up is already opened

[Tuariq]

Team,

I have a scenario where as soon as focus comes onto control, the dropdown must open and user can start typing.

While dropdown is opened, the binded value as well data source/query can be changed by server and I have to update it in control (The dropdown is still opened)

This scenario is giving issues as binded value do not change and dropdown value get blank.

Could you please provide a demo how to achieve this considering following situations?

Control: MultiselectDropdown

Filtering: True

OpenOnClick: True

DataSource: Remote via WebAPIAdaptor

Thanks

Tuariq

[Sureshkumar P]

Hi Tuariq, 

 

Greetings from Syncfusion support. 

 

Based on your shared information, we suspect that you want to load the popup data based on your typed value. We suggest you use our filtering functionality to achieve your requirement.  

 

Please find the code example here: 

[sample.html] 

<ejs-multiselect id='multiselect-filtering' [dataSource]='data' [fields]='fields' (filtering)='onFiltering($event)' 

    [allowFiltering]='true' [placeholder]='watermarks'></ejs-multiselect> 

 

[sample.ts] 

FilteringEventArgs) => { 

  let query: Query = new Query(); 

  //frame the query based on search string with filter type. 

  query = (e.text !== '') ? query.where('Name', 'startswith', e.text, true) : query; 

  //pass the filter data source, filter query to updateData method. 

  e.updateData(this.data, query); 

}; 

 

 

We have created the sample based on your requirement. please find the sample here: https://stackblitz.com/edit/angular-fbnbsd?file=app.component.ts  

 

To know more about filtering functionality, please refer the below documentation and online demo link. 

 

Documentation link: https://ej2.syncfusion.com/angular/documentation/multi-select/filtering/  

 

Online demo Link: https://ej2.syncfusion.com/angular/demos/#/material/multi-select/filtering  

 

If we misunderstood your requirement. please share any pictorial or video demonstration of your exact requirement. that will help us to provide exact solution as earlier as possible. 

 

Regards, 

Sureshkumar P