Persisting Filters and Groupings

6 posts, 0 answers
  1. Ivaylo
    Ivaylo avatar
    3 posts
    Member since:
    Jul 2016

    Posted 05 Sep 2017 Link to this post

    Hello,

    We are experiencing some problems with persisting grid options and particularly with the filters and groupings. We are using Razor and not javascript.

    We successfully persisted the options for the grid but after using setOptions some strange behavior was observed:

    Problem 1. We have group by and the options are persisted. After using setOptions the groupings are present but if you try to filter using a filter that has check boxes(multi filter is set to true), the filter contains no options.

    Problem 2. We have checkbox multi filter by some column and options are persisted. After using setOptions the filters will contain ONLY the values that were checked. Even after clearing the filter the values are not re populated but we are left only with the options that we had after setOptions.

     

    I have spent lots of time reading on the forums but couldn't find a suitable solution. Any help would be appreciated.

  2. Stefan
    Admin
    Stefan avatar
    3074 posts

    Posted 07 Sep 2017 Link to this post

    Hello Ivaylo,

    The described result is expected because the filter menu is making the items based on the Grid Datasource. Then the filtered dataSource is set the filter menu options are made only based on the value in the filtered Grid.

    In this scenario, I can suggest using a separate dataSource for the filter menu to ensure that the Grid dataSource will not affect the result:

    columns.Bound(e => e.FirstName).Width(220).Filterable(ftb => ftb.Multi(true)
                        .DataSource(ds => ds.Read(r => r.Action("Unique", "Grid").Data("{ field: 'FirstName' }")))
                    );

    Also, it may work when disabling the server operations, but this is more major changed to the application.

    If the issue still occurs, please send a fully runnable example and I will gladly assist.

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Ivaylo
    Ivaylo avatar
    3 posts
    Member since:
    Jul 2016

    Posted 07 Sep 2017 in reply to Stefan Link to this post

    Hello,

    I did find this approach but my case is unusual. I have hundreds of grids that have different columns so a different data source for each is not an option for me and also from the documentation that I found I need to call read method for each data source once I change any filters or groupings - this should be done in the databound event??. 

     

    My scenario:

    DropDown one     |      DropDown two
    --------------------------------------------------
    Grid 1/2/3/4/5/6/7/8 ... n

    Grids are rendered in partial views and are a result from the DropDowns selection. Each grid has its own set of columns to show. Having a data source for each column will cause significant performance impact.

    Is there any other approach that you could suggest?

     

    /Ivo

  4. Stefan
    Admin
    Stefan avatar
    3074 posts

    Posted 08 Sep 2017 Link to this post

    Hello Ivaylo,

    I do understand that this will require many additional changes to the all existing Grids. Still, the only other option will be to remove the server operations. By removing the server operations all modifications will be made on the client and the data will be requested at once without making multiple requests. This is accepted approach for Grid which does not contain hundreds of thousands of records. The data heavy Grids will require separate dataSource for all column and the smaller Grids can be set to client operations.

    Another option will be just before saving the Grid options to retrieve the filter using the filter method in a variable, then to set the filter to empty before saving the Grid options and then to apply the saved filters again. When the options have to be set again, the separately saved filter can be applied using the filter method after the options are set. This will create a scenario where the filter will be saved separately and they will not affect the check box rendering. Please have in mind that this may cause a small flashing of the data when the filters are removed and re-applied:

    http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-filter

    // Example flow
     
    var filter = grid.dataSource.filter()
    grid.dataSource.filter({})
    var options = grid.getOptions;
    grid.dataSource.filter(filter)
     
    // On options load
     
    grid.setOptions(options)
    grid.dataSource.filter(filter)


    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Ivaylo
    Ivaylo avatar
    3 posts
    Member since:
    Jul 2016

    Posted 12 Sep 2017 in reply to Stefan Link to this post

    Hello,

    I was working on something else. Can you give me an example how to set the same data source for couple of columns? It works in JS but I couldn't make it work in Razor. Also an easy way to call datasource.read when filtering, It seems that I cant find an event after filtering.

    Thanks,

    Ivo

  6. Stefan
    Admin
    Stefan avatar
    3074 posts

    Posted 13 Sep 2017 Link to this post

    Hello Ivaylo,

    Please check our example on how to use a sharedDataSource in MVC:

    http://demos.telerik.com/aspnet-mvc/datasource/shared-datasource

    Also, there is an example runnable example, with Multi-check filter and shared Datasource:

    http://docs.telerik.com/aspnet-mvc/helpers/grid/how-to/Filtering/grid-with-excel-like-filter

    As for the filtering event, we do have a filtering event, but it is fired just before filtering, not after it:

    http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-filter

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top