ejs-multiselect first option exceeds box limints

[alex niki]

Hello. I think It not necessary to provide my code in this case.

As you can see in the gif, having typed "DEL" the first (grey) option is "DELIPOST", while the second "DELTIUS".

Next, I type "T" and the first option is not "DELTIUS", as I expected. Although, If I scroll until I find "DELTIUS", I see that it's color is grey.

What are some possible solutions here?

Thanks in advance!

Attachment: ezgif.comcrop_2e17920.rar

[Vinoth Kumar Sundara Moorthy]

Hi Alex, 

 

Thank you for contacting Syncfusion support. 

 

We have checked the shared image and could not able to reproduce the issue. In multiselect filtering we have filtered the item based on the value property and value field must be unique. So, we suspect that you have bounded duplicate dataSource.  

 

So, we suggest you achieve your requirement through filtering event using the public updateData method. Where we can able to specify the filterType as ‘startswith’ to filter the item from the starting with specified character. Please refer the below code, 

 

Code Snippet 

public onFiltering: EmitType<FilteringEventArgs> = (e: FilteringEventArgs) => { 

    let query: Query = new Query(); 

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

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

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

    e.updateData(this.data, query); 

}; 

 

Sample link: https://stackblitz.com/edit/angular-tgqtsf?file=app.component.ts 

 

Could you please check the above sample and get back to us with code snippet if issue persists? 

 

Regards, 

Vinoth Kumar S