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. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

ASP.NET Core EJ2 Grid with WebApiAdaptor - server side

Thread ID:

Created:

Updated:

Platform:

Replies:

144409 May 5,2019 06:52 PM UTC Jun 10,2019 06:25 AM UTC ASP.NET Core - EJ 2 6
loading
Tags: DataGrid
ashimaz
Asked On May 5, 2019 06:52 PM UTC

Hi,

I have been going through forum for last 3-4 hours on a solution for filtering with "<e-grid-filtersettings type="Menu"></e-grid-filtersettings>" on server side.
Unfortunately most of the sample is missing the filter server side using WebApiAdaptor.

I found out the Request.Query returned by filter is not of same format, so using filter.Split on 'eq' amd 'ne' required bit coding.

startswith(tolower(Name),'1')
endswith(tolower(Name),'1')
substringof('1',tolower(Name)) should be substringof(tolower(Name), '1')
tolower(Name) eq '1' should be eq(tolower(Name), '1')
tolower(Name) ne '1' should be ne(tolower(Name), '1') , I think this should make split code must easier.

Is there any easy way to do server side filtering with WebApiAdaptor? please provide a demo.

So far my code looks like this, but stuck at filtering...
.cshtml
<ejs-grid id="Grid1" allowFiltering="true" allowSorting="true" allowPaging="true">
                    <e-grid-filtersettings type="Menu"></e-grid-filtersettings>
                    <e-data-manager url="/api/admin" adaptor="WebApiAdaptor" crossdomain="true"></e-data-manager>
                    <e-grid-columns>
                        <e-grid-column field="Id" type="number" width="80" allowFiltering="false"></e-grid-column>
                        <e-grid-column field="Name" type="string" width="200"></e-grid-column>
                        <e-grid-column field="CreatedBy" type="string" width="100" allowFiltering="false"></e-grid-column>
                        <e-grid-column field="CreatedDate" customFormat="@(new {type = "date", format = "dd/MM/yyyy"})" type="date" width="100" allowFiltering="false"></e-grid-column>
                        <e-grid-column field="ModifiedBy" type="string" width="100" allowFiltering="false"></e-grid-column>
                        <e-grid-column field="ModifiedDate" customFormat="@(new {type = "date", format = "dd/MM/yyyy"})" type="date" width="100" allowFiltering="false"></e-grid-column>
                    </e-grid-columns>
                </ejs-grid>

Code
        // GET api/admin
        [HttpGet]
        public object GetApiRoles()
        {
            //--filter--startswith(tolower(Name),'1')
            //--filter--endswith(tolower(Name),'1')
            //--filter--substringof('1',tolower(Name))
            //--filter--tolower(Name) eq '1'
            //--filter--tolower(Name) ne '1'

            IQueryable<Apiroles> data = _context.Apiroles;
            var queryString = Request.Query;
            var skip = Convert.ToInt32(queryString["$skip"]);
            var take = Convert.ToInt32(queryString["$top"]);
            string filter = queryString["$filter"];

            if (filter != null)
            {
                string key;
                int keys = filter.Split(new string[] { "'" }, StringSplitOptions.None).Count();
                if (keys > 1)
                {
                    string[] key1 = filter.Split(new string[] { "'" }, StringSplitOptions.None);
                    data = data.Where(p => p.Name.Contains(key1[1].ToString()));
                }
                else
                {
                    string[] str = filter.Split(new string[] { " " }, StringSplitOptions.None);
                    var val = str[2];
                    data = data.Where(fil => fil.Name ==  val || fil.Name ==  val);
                }
            }
            return take != 0 ? new { Items = data.Skip(skip).Take(take).ToList(), Count = data.Count() } : new { Items = data.ToList(), Count = data.Count() };
        }




Pavithra Subramaniyam [Syncfusion]
Replied On May 6, 2019 12:56 PM UTC

Hi shimaz, 
 
Thanks for contacting Syncfusion support. 
 
For WebApiAdaptor we need to handle the Grid actions such as filtering, paging, sorting in server side by manually. We have prepared a simple sample for server side Menu filtering with WebApiAdaptor. Please refer to the below code example and sample link for more information. 
 
[controller.cs] 
  public class OrdersController : Controller 
    { 
        // GET: api/Orders 
        [HttpGet] 
 
        public object Get() 
        { 
            var queryString = Request.Query; 
            var data = OrdersDetails.GetAllRecords().ToList(); 
            string filter = queryString["$filter"]; 
            string auto = queryString["$inlineCount"]; 
            // filtering 
            if (filter != null) 
            { 
                var newfiltersplits = filter; 
                var filtersplits = newfiltersplits.Split('(', ')', ' '); 
                var filterfield = filtersplits[1]; 
                var filtervalue = filtersplits[3]; 
 
                if (filtersplits.Length == 5) 
                { 
                    if (filtersplits[1] == "tolower") 
                    { 
                        filterfield = filter.Split('(', ')', '\'')[2]; 
                        filtervalue = filter.Split('(', ')', '\'')[4]; 
                    } 
                } 
                if (filtersplits.Length != 5) 
                { 
                    filterfield = filter.Split('(', ')', '\'')[3]; 
                    filtervalue = filter.Split('(', ')', '\'')[5]; 
                } 
                switch (filterfield) 
                { 
                    case "CustomerID": 
                        data = (from cust in data 
                                where cust.CustomerID.ToLower().StartsWith(filtervalue.ToString()) 
                                select cust).ToList(); 
                        break; 
                } 
            } 
            // paging 
            int skip = Convert.ToInt32(queryString["$skip"]); 
            int take = Convert.ToInt32(queryString["$top"]); 
            if (auto == null) 
            { 
                return new { Items = data }; 
            } 
            else 
            { 
                return take != 0 ? new { Items = data.Skip(skip).Take(take).ToList(), Count = data.Count() } : new { Items = data, Count = data.Count() }; 
            } 
        } 
 
 
Regards, 
Pavithra S. 


ashimaz
Replied On May 7, 2019 06:14 AM UTC

Hi Pavithra,

Thank you for replying, my code is working now.

IQueryable < Apiroles > data = _context.Apiroles;

var queryString = Request.Query;
var skip = Convert.ToInt32(queryString["$skip"]);
var take = Convert.ToInt32(queryString["$top"]);
string filter = queryString["$filter"];
string sort = queryString["$orderby"];

if (filter != null) {
 var newfiltersplits = filter;
 var filtersplits = newfiltersplits.Split('(', ')', ' ');
 var filterfield = filtersplits[1];
 var filtervalue = filtersplits[3];

 if (filter.Contains("eq") || filter.Contains("ne")) {
  filterfield = filter.Split('(', ')', '\'')[2];
  filtervalue = filter.Split('(', ')', '\'')[4];
 }

 if (filter.Contains("substringof")) {
  filterfield = filter.Split('(', ')', '\'')[5];
  filtervalue = filter.Split('(', ')', '\'')[3];
 }

 if (filter.Contains("startswith") || filter.Contains("endswith")) {
  filterfield = filter.Split('(', ')', '\'')[3];
  filtervalue = filter.Split('(', ')', '\'')[5];
 }

 switch (filterfield) {
  case "Name":
   if (filter.Contains("startswith")) {
    data = data.Where(x => x.Name.StartsWith(filtervalue.ToString()));
   } else if (filter.Contains("endswith")) {
    data = data.Where(x => x.Name.EndsWith(filtervalue.ToString()));
   } else if (filter.Contains("substringof")) {
    data = data.Where(x => x.Name.Contains(filtervalue.ToString()));
   } else if (filter.Contains("eq")) {
    data = data.Where(x => x.Name == filtervalue.ToString());
   } else if (filter.Contains("ne")) {
    data = data.Where(x => x.Name != filtervalue.ToString());
   }
   break;
 }
}

if (sort != null) {
 int keys = sort.Split(new [] {
  " "
 }, StringSplitOptions.None).Count();
 if (keys > 1) {
  string[] key1 = sort.Split(new [] {
   " "
  }, StringSplitOptions.None);
  // Required linq dynamic
  data = data.OrderBy(key1[0] + " descending");

 } else {
  // Required linq dynamic
  data = data.OrderBy(sort);
 }
}

return take != 0 ? new {
 Items = data.Skip(skip).Take(take).ToList(), Count = data.Count()
} : new {
 Items = data.ToList(), Count = data.Count()
};

Pavithra Subramaniyam [Syncfusion]
Replied On May 7, 2019 08:57 AM UTC

Hi shimaz,  

Thanks for your update. 

We are happy to hear your issue has been resolved. 

Please contact us if you need any further assistance. As always, we will be happy to assist you.  

Regards,  
Pavithra S. 


Gabor Horovitz
Replied On June 6, 2019 06:59 PM UTC

I can not believe we are implementing this in custom code in 2019, version 17.  (filter, sort, take, skip)

To parse what grid sends should be supported in server side out the box (as a part of the support lib), to prevent reinvent the wheel, and copy and paste. This is so typical repeated for a paging grid. Kendo for ASP has it since more than 5 years... just one line call which takes the request parameter and outputs the IQueryable. Btw, calling the ToList() on IQueryable and after then applying the Skip and Take is a serious mistake, and all Syncfusion sample uses it.

ashimaz
Replied On June 6, 2019 08:08 PM UTC

Yes, going forward this has to be implemented by syncfusion team.
For now my code works.

Pavithra Subramaniyam [Syncfusion]
Replied On June 10, 2019 06:25 AM UTC

Hi shimaz, 
 
Thanks for your updates Gabor and shimaz. 
 
In Essential JavaScript 2, We already have an option called UrlAdaptor  which has an option to perform server side paging, filtering, sorting actions with inbuilt DataOperation and DataMangerRequest. You can use the UrlAdaptor of DataManager when binding data source from remote data. In the initial load of grid, data are fetched from remote data and bound to the grid using url property of DataManager. You handled paging, filtering actions like in the below code example. We have prepared a sample based on your requirement. Please find the below code example and sample for your reference. 
 
[code example] 
<ejs-grid id="GridOverview" allowFiltering="true" allowPaging="true"> 
    <e-data-manager url="/Home/UrlDataSource" adaptor="UrlAdaptor"></e-data-manager> 
    <e-grid-pagesettings pageSize="4"></e-grid-pagesettings> 
    <e-grid-filtersettings type="Menu"></e-grid-filtersettings> 
    <e-grid-columns> 
        <e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" textAlign="Right" width="100"></e-grid-column> 
        <e-grid-column field="CustomerID" headerText="Customer ID" type="string" width="120"></e-grid-column> 
        <e-grid-column field="Freight" headerText="Freight" textAlign="Right" format="C2" editType="numericedit" width="120"></e-grid-column> 
        <e-grid-column field="ShipCountry" headerText="Ship Country" width="150"></e-grid-column> 
    </e-grid-columns> 
</ejs-grid> 
 
... 
public class HomeController : Controller 
    { 
       [HttpPost] 
        public IActionResult UrlDatasource([FromBody]DataManagerRequest dm) 
        { 
            IEnumerable DataSource = OrdersDetails.GetAllRecords(); 
            DataOperations operation = new DataOperations(); 
            if (dm.Search != null && dm.Search.Count > 0) 
            { 
                DataSource = operation.PerformSearching(DataSource, dm.Search);  //Search 
            } 
            if (dm.Sorted != null && dm.Sorted.Count > 0) //Sorting 
            { 
                DataSource = operation.PerformSorting(DataSource, dm.Sorted); 
            } 
            if (dm.Where != null && dm.Where.Count > 0)  
            { 
                DataSource = operation.PerformFiltering(DataSource, dm.Where, dm.Where[0].Operator);     //Filtering 
            } 
            int count = DataSource.Cast<OrdersDetails>().Count(); 
            if (dm.Skip != 0) 
            { 
                DataSource = operation.PerformSkip(DataSource, dm.Skip);   //Paging 
            } 
            if (dm.Take != 0) 
            { 
                DataSource = operation.PerformTake(DataSource, dm.Take); 
            } 
            return dm.RequiresCounts ? Json(new { result = DataSource, count = count }) : Json(DataSource); 
        } 
        ... 
   } 
... 
 
 
 
Please get back to us if you need further assistance. 
 
Regards, 
Pavithra S. 
 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon