Does Telerik have plans for custom filtering in the Telerik ASP.NET Core UI Grid

[Reid]

Does Telerik have plans for custom filtering in the Telerik ASP.NET Core UI Grid?

When I ask, "Custom" I mean truly custom. 

Our need is to have a listbox (or similar) with multiple check boxes (scrolling) in it for each column of each grid.
This is for allowing the user to select one or more values.  These are parameter values.

So if we could inject a Razor partial or draw it in a hooked event into the row[0] of the grid we could gather these values when the search button is clicked.

Right now we draw the filtering partial view above the grid and play hell trying to align column widths in general, but our designer cannot make it work with mobile resolutions, etc.  So we need to draw the filter in the grid to make it work.

If Telerik has no plans to accommodate this scenario we need to know.  And if necessary we have to find a component suite that does.

[Veselin Tsvetanov]

Hi Reid,

The Telerik .Net Core Grid supports Multi Checkbox filter for each of its columns. On the following Demo you will find two examples of how to configure such a filter in the Grid:

- Column configured with client-side filtering:

@( Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>()
    .Name("client")
    .Columns(columns =>
    {
        columns.Bound(p => p.ProductName).Filterable(ftb => ftb.Multi(true).Search(true));
...

- And configured with server filtering:

@( Html.Kendo().Grid<Kendo.Mvc.Examples.Models.EmployeeViewModel>()
    .Name("server")
    .Columns(columns =>
    {
        //when ServerOperations of the Grid is enabled, dataSource should be provided for all the Filterable Multi Check columns
        columns.Bound(e => e.FirstName)
            .Width(220)
            .Filterable(ftb => ftb.Multi(true)
            .Search(true)
            .DataSource(ds => ds.Read(r => r.Action("Unique", "Grid").Data("{ field: 'FirstName' }")))
         );
....

Note that in the second case the server operations on the Grid DataSource are also enabled:

.DataSource(dataSource => dataSource
    .Ajax()
    .ServerOperation(true)
    .Read(read => read.Action("HierarchyBinding_Employees", "Grid"))
)

If the above does not cover the scenario in question, I would like to ask you to explain a bit more in detail what is the needed functionality of the filter. This way I will be able to provide you with some further hints on how to achieve the desired.

Regards,
Veselin Tsvetanov
Progress Telerik

[Reid]

Thank you for the reply.

While this might work for part of our need (multi checkbox) what about anything else?  When I say custom I mean the ability to add *any* controls.  Check boxes, drop downs together, etc.

[Veselin Tsvetanov]

Hi Reid,

You could define a custom widget (DropDownList, for example) as a filter by using the UI() method of the filterable configuration:

columns.Bound(e => e.Title).Filterable(filterable => filterable.UI("titleFilter"));

That should point to a function returning the actual filter:

  function titleFilter(element) {
        element.kendoAutoComplete({
            dataSource: {
                transport: {
                    read: "@Url.Action("FilterMenuCustomization_Titles")"
                }
            }
        });
    }

Here is a demo on the above: https://demos.telerik.com/aspnet-core/grid/filter-menu-customization

That, however, would not allow you to use it in combination with the checkboxes filtering in the same filter. If you want to define an entirely custom filter container with custom widgets as per your requirement, you will have to create that as an external element (outside the default filter pop-up). That would also require a custom implementation for the filtering logic of the Grid source.

FOr example, to achieve the desired, you could disable the available filtering in the Grid, inject with jQuery a custom icon in the corresponding column title. Attach a click handler to that icon that would open a Kendo Popup. In that pop-up, you could define any types of widgets, inputs, and buttons that your use case requires. Upon filter submit, you should implement the custom logic that will gather the info from the inputs and widgets, build the actual filter expression and filter the Grid DataSource.

Regards,
Veselin Tsvetanov
Progress Telerik

[Reid]

Thank you for this.  I apologize about the delay.  I am no longer on that project and as such have not needed to implement anything since.

 

Best wishes