Custom Search Filter for FilterItemTemplate

[Kenney Phan]

Hi,

I have a data grid Foreign column displaying 'First Name' of users. Inside that column, I have a FilterItemTemplate to display 'First Name + Last Name' of users.

I want to be able to search in the filter for both First Name and Last Name, but right now I can only search for First Name.

How do I create a custom search filter so that I can search both First Name and Last Name?

I have attached a picture and video.

Thank you,

Kenney

Attachment: Custom_Search_Filter_for_FilterItemTemplate_76ff452d.zip

[Renjith Singh Rajendran]

Hi Kenney, 

Greetings from Syncfusion support. 

We suggest you to ensure to generate custom data based on the search key value you get in GetSearchedList method and assign to Args.CheckboxListData to achieve this requirement. The list assigned in Args.CheckboxListData will only be displayed in the checkbox list. So we suggest you to ensure to fetch list based on your search key value. 

Based on your scenario, we suggest you to use like the below codes, 

 

<GridForeignColumn Field=@nameof(Order.EmployeeID) ForeignKeyValue="FirstName" ForeignDataSource="@Employees" HeaderText="Bio" Width="150">    <Template>        @{            var filterContext = (context as Order);            var itemTemplateValue = Employees.Find(x => x.EmployeeID == filterContext.EmployeeID);        }        @itemTemplateValue.FirstName - @itemTemplateValue.LastName    </Template>    <FilterItemTemplate>        @{            var filterContext = (context as FilterItemTemplateContext);            var itemTemplateValue = Employees.Find(x => x.EmployeeID.ToString() == ((Employee)filterContext.Record).EmployeeID.ToString());        }        @itemTemplateValue.FirstName @itemTemplateValue.LastName    </FilterItemTemplate></GridForeignColumn>
public void ActionBeginHandler(ActionEventArgs<Order> Args){    ...    else if (Args.RequestType == Syncfusion.Blazor.Grids.Action.FilterBeforeOpen)    {        if (string.Equals(FilterCol, "EmployeeID", StringComparison.Ordinal))        {            Args.CheckboxListData = Employees;        }    }}public List<Employee> GetSearchedList(string key){    string[] result = key.Split(' ');    List<int?> empdata = new List<int?>();    if (result.Count() == 2)    {        //you need to handle the search and return the search result        empdata = Employees.Where(fil => fil.FirstName.ToLower().ToString().StartsWith(result[0].ToLower()) && fil.LastName.ToLower().ToString().StartsWith(result[1].ToLower())).Select(x => x.EmployeeID).ToList();    }    else    {        //you need to handle the search and return the search result        empdata = Employees.Where(fil => fil.FirstName.ToLower().ToString().StartsWith(result[0].ToLower()) || fil.LastName.ToLower().ToString().StartsWith(result[0].ToLower())).Select(x => x.EmployeeID).ToList();    }    var data = new List<Employee>();    foreach (var emp in empdata)    {        data.Add(Employees.Where(x => x.EmployeeID.Equals(emp)).FirstOrDefault());    }    //perform your custom action.    return data;}

We have also modified the sample provided in our previous update from this thread. Please download and refer the sample from the link below, 

Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/ExcelCheckboxfilter-939169866 

Please get back to us if you need further assistance. 

Regards, 

Renjith R