CODEWITHSUNDEEP
model-view-controllerkendo-ui
user4546142
user4546142

Reputation:

Kendo Server Side Grid Filtering/Sorting

I don't really know how to achieve my requirement which is:

So basically I want to set the client filter control to a server side defined value. After page load the user could overwrite this setting and retrieve a list of the complete data set.

I am using following Grid:

@(Html.Kendo().Grid<SubscriptionViewModel>()
      .DataSource(dataSource => dataSource
          ...
          .ServerOperation(true)

      )
      .Name("subscriptionsGrid")         
      .Columns(columns =>
      {
          ...
          columns.Bound(p => p.SubscriptionValidStatus).Filterable(filterable=>filterable.UI("subscriptionStatusFilter")).HeaderHtmlAttributes(new { style = "white-space: normal; vertical-align: top" });
          ....

      })          
      .Scrollable(a => a.Height("700px"))
      .Selectable(selectable => selectable
          .Mode(GridSelectionMode.Single)
      )
      ...
      .Sortable()
      .Filterable(filterable => filterable
        .Extra(false)
      )
      )

Upvotes: 0

Views: 708

Answers (3)

Atta H.
Atta H.

Reputation: 691

I was looking for row filter, and add multiple filters in it. I found the following article very helpful. It is using [Kendo.Mvc.CompositeFilterDescriptor] to filter

https://www.telerik.com/forums/how-do-i-use-compositefilterdescriptor-to-set-the-initial-datasource

Upvotes: 0

user4546142
user4546142

Reputation:

thx for your possible solution Dinglemeyer

I just figured out how to do it server side; by adding:

.Filter(factory => factory.Add(model=> model.SubscriptionValidStatus).IsEqualTo("Aktiv"))

to datasource!

Upvotes: 2

Dinglemeyer NeverGonnaGiveUUp
Dinglemeyer NeverGonnaGiveUUp

Reputation: 712

Rather than a server side default filtering, you could have a client side event add the filter on page load... The practical effect will be your filter in place, at which point a user could select the filter widget in the column header to remove it, or they could add more filters to other columns. I've taken some of my code that I use to do this and renamed it for your grid's name.

Try this out!

In your grid definition, add a events like the following:

.Events(events => events.DataBound("dataBoundSetFilter"))

Then have a javascript function to set the filter of a column with your preferred filtering:

 <script type="text/javascript">

        // hasBound variable set on page load to false, will be set true after Grid databound event
        var hasBound = false;
        function dataBoundSetFilter(e) {
            // If the grid has not yet been data-bound, apply this here filter
            if (hasBound === false) {
                //alert("Start");
                // Get a reference to the grid
                var grid = $("#subscriptionsGrid").data("kendoGrid");
                // Apply a filter to the grid's datasource
                grid.dataSource.filter({ field: "SubscriptionValidStatus", operator: "eq", value: true });
                // Set hasBound = true so this won't be triggered again...
                hasBound = true;
            }
        }
    </script>

Upvotes: 1

Related Questions