Thread ID: |
Created: |
Updated: |
Platform: |
Replies: |
141638 | Dec 23,2018 12:00 PM UTC | Feb 15,2020 03:34 PM UTC | Angular - EJ 2 | 3 |
![]() |
Tags: DropDownList |
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);
} |
Hi Evgeny,
Thanks for contacting Syncfusion Support.
We suggest you to change the filter type as “contains” through filtering event of DropDownList as shown below
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);}
We have prepared a sample for reference. Please refer to the below given link
UG : https://ej2.syncfusion.com/angular/documentation/drop-down-list/filtering/#change-the-filter-type
Please let us know if you need any further assistance.
Thanks,
Christo
[app.component.html]
<ejs-dropdownlist id='remoteData' #remote [dataSource]='data | async' [filterType]='filterType' [allowFiltering]='true'
[fields]='remoteFields' [placeholder]='remoteWaterMark' sortOrder='Ascending'></ejs-dropdownlist>
[app.component.ts]
@ViewChild('remote')
public multiselectObj: DropDownListComponent;
public data: any;
constructor(private http: HttpClient) {
}
ngOnInit() {
this.getData();
}
public getData() {
this.data = this.http.get<{ [key: string]: object; }[]>('https://services.odata.org/V4/Northwind/Northwind.svc/Orders').pipe(
map(data => {
return (<any>data).value;
})
);
}
public remoteFields: Object = { text: 'CustomerID', value: 'CustomerID' };
// set the placeholder to MultiSelect input element
public remoteWaterMark: string = 'Select names';
public filterType: any = 'Contains';
@ViewChild('remote')
public multiselectObj: DropDownListComponent;
public data: any;
constructor(private http: HttpClient) {
}
ngOnInit() {
this.getData();
}
public getData() {
this.data = this.http.get<{ [key: string]: object; }[]>('https://services.odata.org/V4/Northwind/Northwind.svc/Orders').pipe(
map(data => {
return (<any>data).value;
})
);
}
public remoteFields: Object = { text: 'CustomerID', value: 'CustomerID' };
// set the placeholder to MultiSelect input element
public remoteWaterMark: string = 'Select names';
public filterType: any = 'Contains';
|
This post will be permanently deleted. Are you sure you want to continue?
Sorry, An error occured while processing your request. Please try again later.
This page will automatically be redirected to the sign-in page in 10 seconds.