We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Filter / Sorting / Searching Concept

Hi Team,

I would like to understand if the filtering, sorting and searching that happens on the grid is achieved from different calls / outputs from the web service or does the syncfusion control perform the operation on the UI level.

This concept will help me understand more on how to implement my web service.

Regards,
Aravind

4 Replies

JK Jayaprakash Kamaraj Syncfusion Team December 19, 2016 11:46 AM UTC

Hi Aravind, 
 
Thank you for contacting Syncfusion support. 
 
While using web services in Grid, we need to handle (paging/filtering/sorting..etc) operations in server side. We can get all the grid action queries in the server side, based on that value we can perform the corresponding actions in server side and return the processed data. Please refer to the below code example 


@(Html.EJ().Grid<object>("Grid") 
              .Datasource(ds => ds.URL("/odata/Orders").Adaptor(AdaptorType.ODataV4Adaptor)) 
              .AllowPaging() //Paging 
              .AllowGrouping() 
              .AllowSorting() // sorting 
              .AllowResizing() // Resizing 
              .AllowFiltering() // Filtering 
              .FilterSettings(f => f.FilterType(FilterType.Excel)) 
              .PageSettings(page => { page.PageSize(8); }) 
              .EnableAltRow() 
              .Columns(col => 
              { 
                  col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).TextAlign(TextAlign.Right).Width(90).Add(); 
                  col.Field("CustomerID").HeaderText("Customer ID").Width(80).Add(); 
.. 
              }) 
    ) 
OrdersController.cs 
  // GET api/<controller>        
        public PageResult<OrdersView> Get(ODataQueryOptions opts) 
        { 
            var results = db.OrdersViews.AsQueryable(); 
            var count = results.Count(); 
            if (opts.OrderBy != null)// perform sorting 
                results = opts.OrderBy.ApplyTo(results); 
            if (opts.Filter != null) 
            { 
                if (opts.Filter.RawValue.Contains("substring")) //perform searching 
                { 
                    string key = opts.Filter.RawValue.Split(new string[] { "'" }, StringSplitOptions.None)[1]; 
                    results = results.Where(fil => fil.CustomerID.Contains(key) || fil.EmployeeID.ToString().Contains(key) || fil.Freight.ToString().Contains(key) || fil.OrderID.ToString().Contains(key) || fil.ShipCountry.Contains(key)); 
                } 
                else 
                    results = opts.Filter.ApplyTo(results, new ODataQuerySettings()).Cast<OrdersView>(); 
            } 
            if (opts.InlineCount != null) 
                count = results.Count(); 
            if (opts.Skip != null) //perform skip 
                results = opts.Skip.ApplyTo(results, new ODataQuerySettings()); 
            if (opts.Top != null) //perform take 
                results = opts.Top.ApplyTo(results, new ODataQuerySettings()); 
 
            var data = results; 
            return new PageResult<OrdersView>(results, null, count); 
        }         

Regards, 
 
Jayaprakash K. 



AA Aravind Ashokkumar December 20, 2016 01:36 AM UTC

Hi Jayaprakash,

Thank you for the response. This is good if you have a strongly typed object on the server side for processing the output. (PageResult<OrdersView> )

Could you please let me know if you have an example for a "dyanmic" object.? Or using a JSON object.

Regards,
Aravind



AA Aravind Ashokkumar replied to Aravind Ashokkumar December 20, 2016 01:38 AM UTC

Hi Jayaprakash,

Thank you for the response. This is good if you have a strongly typed object on the server side for processing the output. (PageResult<OrdersView> )

Could you please let me know if you have an example for a "dyanmic" object.? Or using a JSON object.

Regards,
Aravind


Also, I would like to know if there is an example using just Web API without using OData.


JK Jayaprakash Kamaraj Syncfusion Team December 20, 2016 01:14 PM UTC

Hi Aravind, 
 
The grid queries can be accessed using HttpContext.Current.Request.QueryString property in WebAPI Get method and you can handle the server-side data operation using those queries. Please refer to the following code example.    
 
public object Get() 
        { 
            List<OrdersView> ord = db.OrdersViews.ToList(); 
            var queryString = HttpContext.Current.Request.QueryString; 
            int skip = Convert.ToInt32(queryString["$skip"]); 
            int take = Convert.ToInt32(queryString["$top"]); 
            string sort =queryString["$orderby"];//sorting   
            var filter = queryString["$filter"]; 
            if (filter != null) 
            { 
                string key; 
                if (filter.Contains("substring"))//searching 
                { 
                    key = filter.Split(new string[] { "'" }, StringSplitOptions.None)[1]; 
                    ord = ord.Where(fil => fil.CustomerID.Contains(key.ToUpper()) || fil.EmployeeID.ToString().Contains(key) || fil.Freight.ToString().Contains(key) || fil.OrderID.ToString().Contains(key) || fil.ShipCountry.Contains(key)).Distinct().ToList(); 
                } 
            } 
            else 
            { 
 
                ord = ord.Skip(skip).Take(take).ToList(); 
            } 
            var count = ord.Count; 
            return new {Items = ord, Count = count }; 
        }         
 
For your convenience, we have created a sample and the same can be downloadable from the following link.    
 

Regards, 
 
Jayaprakash K. 


Loader.
Up arrow icon