Filtering a grouped SfListView

[Francis Tang]

Grateful if given or pointed to an example of searchbar filtering for a grouped SfListView

Thanks in advance.

Francis

[Gnana Priya Namasivayam]

Hi Francis, 

  

We would like to inform you that we have already documented regarding grouping and customized filtering in our SfListView documentation. Please find the sample and code snippets from below link for your reference. 

  

Grouping: https://help.syncfusion.com/xamarin/listview/grouping#programmatic-grouping 

  

Filtering: https://help.syncfusion.com/xamarin/listview/filtering#programmatic-filtering 

  

Regards, 

Gnana Priya N 

[Francis Tang]

Thanks but actually I wanted filtering for a grouped list view instead, not the separated examples you listed below.

I guess filtering for a grouped listview would be quite different from filtering for an ungrouped one.

Really grateful if you can demonstrate how to search a grouped listview with Syncfusion. I don't need any sorting of items in the list though. Thanks.

Francis

[Gnana Priya Namasivayam]

Hi Francis, 

We have attached the filtering sample along with grouping as requested meanwhile we would like to inform that you can filter items based on the customizing model property like in FilterContacts method below and when the text searched in filtered in the list, group header with respect to the filtered items will also display in view and filtering is same for grouped & ungrouped listview. We have attatched the sample for your reference, please find from following link. 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/GroupFilter-603751175  

ViewModel.cs 

 

private bool FilterContacts(object obj) 

{ 

   if (searchBar == null || searchBar.Text == null) 

     return true; 

 

   var taskInfo = obj as TaskInfo; 

    

   return (taskInfo.Title.ToLower().Contains(searchBar.Text.ToLower()) 

                || taskInfo.Description.ToLower().Contains(searchBar.Text.ToLower()));        } 

Please let us know if you need any further assistance. 

Regards, 

Gnana Priya N 

[Francis Tang]

Hi Gnana,

Thanks very much for your sample code on grouped-listview filtering.

Correct me if I'm wrong, I understand Syncfusion searchbar provides a multi-criteria search. Can one search like:

"Keyword1"  "Keyword2"

"Keyword2"  "Keyword1"

etc

<== assuming both words appear in one particular item being searched

and still can locate that same searched item irrespective or the order of those words? Grateful if an example can also be demonstrated.

Another small issue: The group title in your example showed only the first character of each title. Please help to check. Thanks.

Francis

[Gnana Priya Namasivayam]

Hi Liam, 

 

Regarding Filtering: 

 

You can filter the ListView collection based on model properties using ListView.DataSource.Filter predicate by defining the bool method to this predicate and you can receive the complete model class properties in your FilterContacts method through which you can do customized filtering using code logic based on your requirement. 

 

private void OnTextChanged(object obj) 

{ 

     var grid = (obj as Grid); 

     searchBar = grid.Children[1] as SearchBar; 

     var listview = grid.Children[2] as SfListView; 

     if (listview!=null && listview.DataSource != null) 

     { 

        listview.DataSource.Filter = FilterContacts; 

        listview.DataSource.RefreshFilter(); 

     } 

     listview.RefreshView(); 

} 

 

private bool FilterContacts(object obj) 

{ 

    if (searchBar == null || searchBar.Text == null) 

       return true; 

 

     var taskInfo = obj as TaskInfo; 

     return (taskInfo.Title.ToLower().Contains(searchBar.Text.ToLower()) 

            || taskInfo.Description.ToLower().Contains(searchBar.Text.ToLower())); 

} 

 

 

Regarding group header customization: 

 

Here, while adding GroupDescriptor to Listview model property we can customize using KeySelector like below. 

 

 

listView.DataSource.GroupDescriptors.Add(new GroupDescriptor() 

{ 

    PropertyName = "Tag", 

    KeySelector = (object obj1) => 

    { 

       var item = (obj1 as TaskInfo); 

       return item.Tag[0].ToString(); 

    } 

}); 

 

 

Please let us know if you need any further assistance. 

 

Regards, 

Gnana Priya N 

[Francis Tang]

Thanks. But I need an example showing more than one keyword search in random order, please. Also, the group header in your last example only showed its first character. Please check.

Thanks.

Francis

[Gnana Priya Namasivayam]

Hi Francis, 

 

We would like to inform you that we have prepared the model sample to show filter based on two Key values in SearchBar_TextChanged event. You can see from below screenshot, search bar filter the text containing both Bug(PropertyName = Tag) & Auto(PropertyName= Description) and also we have customized GroupHeader’s text to display full text of Tag property(in previous update we have showed you model to display the single charater of Tag property like ContactsList). Kindly find the respected code snippets and sample from following link for your reference. 

 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/FilterSample-525896499  

 

 

ViewModel.cs 

 

private void OnTextChanged(object obj) 

{ 

    var grid = (obj as Grid); 

    searchBar = grid.Children[1] as SearchBar; 

    var listview = grid.Children[2] as SfListView; 

 

    if (listview != null && listview.DataSource != null) 

    { 

       listview.DataSource.Filter = FilterContacts; 

      listview.DataSource.RefreshFilter(); 

    } 

    listview.RefreshView(); 

} 

private bool FilterContacts(object obj) 

{ 

 

   bool isFiltered=false; 

   if (searchBar == null || searchBar.Text == null) 

      return true; 

   var taskInfo = obj as TaskInfo;    //Codes for customize filter based on 2 keys 

 

   string str = searchBar.Text; 

   char[] separator = { ',', ' ' }; 

   String[] strlist = str.Split(separator); 

 

   foreach (String s in strlist) 

   { 

       if( (taskInfo.Title.ToLower().Contains(s) || taskInfo.Tag.ToLower().Contains(s))) 

       { 

          isFiltered = true; 

       } 

  } 

  return isFiltered; 

} 

 

 

 

Screenshot: 

 

 

 

 

Please let us know if you need any further assistance. 

 

Regards, 

Gnana Priya N 

[Francis Tang]

Thanks very much for your current revised example which should be beneficial to my present app development.

Best wishes.

Francis

[Gnana Priya Namasivayam]

Hi Francis, 

 

 

Thanks for the update. We are glad that provided solution meets your requirement. Kindly let us know if you have any further queries. 

 

 

Regards, 

Gnana Priya N 

[Francis Tang]

Thanks. I think you guys are doing a superb job in helping users of your products.

Francis