Angularjs剑道网格服务器端过滤器

我正在尝试使用Asp.NETMVC和Angularjs开发剑道网格。我的代码如下所述

Index.cshtml

<div ng-controller="telerikGridController">
<kendo-grid options="mainGridOptions">
    <div k-detail-template>
        <kendo-tabstrip>
            <ul>
                <li class="k-state-active">Orders</li>
                <li>Contact information</li>
            </ul>
            <div>
                <div kendo-grid k-options="detailGridOptions(dataItem)"></div>
            </div>
            <div>
                <ul>
                    <li>Country: <input ng-model="dataItem.Country" /></li>
                    <li>City: <input ng-model="dataItem.City"/></li>
                    <li>Address: {{dataItem.Address}}</li>
                    <li>Home phone: {{dataItem.Phone}}</li>
                </ul>
            </div>
        </kendo-tabstrip>
    </div>
</kendo-grid>
</div>

ASP.NET MVC控制器：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using KendoGridApp.Models;
using Kendo.Mvc;
using Kendo.Mvc.UI;

namespace KendoGridApp.Controllers
{
  public class GridController : Controller
  {
    List<Employee> employees = new List<Employee>();
    List<Department> deptList = new List<Department>();

    public GridController()
    {
        Employee employe = new Employee();
        employe.FirstName = "First Name";
        employe.LastName = "Last Name";
        employe.Phone = "+92 302 8888 777";
        employe.Address = " Pakistan";
        employe.DeptId = 1;



        var employe2 = new Employee();
        employe2.FirstName = "First Name 2";
        employe2.LastName = "Last Name 2";
        employe2.Phone = "+92 333 4444 779";
        employe2.Address = "UAE";
        employe2.DeptId = 2;

        var employe3 = new Employee();
        employe3.FirstName = "First Name 3";
        employe3.LastName = "Last Name 3";
        employe3.Phone = "+92 302 4444 779";
        employe3.Address = "Sydney,Australia";
        employe3.DeptId = 3;

        var employe4 = new Employee();
        employe4.FirstName = "First Name 4";
        employe4.LastName = "Last Name 4";
        employe4.Phone = "+92 302 4444 999";
        employe4.Address = "Sydney, Australia";
        employe4.DeptId = 4;

        var employe5 = new Employee();
        employe5.FirstName = "First Name 5";
        employe5.LastName = "Last Name 5";
        employe5.Phone = "+92 302 1111 779";
        employe5.Address = "Dubai, UAE";
        employe5.DeptId = 5;

        var employe6 = new Employee();
        employe6.FirstName = "First Name 6";
        employe6.LastName = "Last Name 6";
        employe6.Phone = "+92 302 0000 779";
        employe6.Address = "Dehli, India";
        employe6.DeptId = 6;

        employees.Add(employe);
        employees.Add(employe2);
        employees.Add(employe3);
        employees.Add(employe4);
        employees.Add(employe5);
        employees.Add(employe6);
    }
    // GET: Grid
    public ActionResult Index()
    {
        return View();
    }

    [HttpGet]
    public JsonResult GetEmployees(DataSourceRequest command)
    {

        int deptId = Convert.ToInt16(Request.Params["filter[filters][0][value]"]);

        employees = employees.Where(x => x.DeptId == deptId).ToList();

        return Json(employees, JsonRequestBehavior.AllowGet);
    }


    [HttpGet]
    public JsonResult Departments()
    {
        Department dept = new Department();
        dept.DeptId = 1;
        dept.DepartmentName = "Information Technology";
        dept.Phone = "+1 111 111 111";
        dept.Country = "Pakistan";
        dept.City = "Lahore";
        dept.Description = "This is Description Text 1";

        Department dept2 = new Department();
        dept2.DeptId = 2;
        dept2.DepartmentName = "Mechnical Engineering";
        dept2.Phone = "+1 222 111 111";
        dept2.Country = "India";
        dept2.City = "Dehli";
        dept2.Description = "This is Description Text 2";

        Department dept3 = new Department();
        dept3.DeptId = 3;
        dept3.DepartmentName = "Civil Engineering";
        dept3.Phone = "+1 111 000 111";
        dept3.Country = "Pakistan";
        dept3.City = "Islamabad";
        dept3.Description = "This is Description Text 3";

        Department dept4 = new Department();
        dept4.DeptId = 4;
        dept4.DepartmentName = "Radiology";
        dept4.Phone = "+1 111 222 000";
        dept4.Country = "UAE";
        dept4.City = "Dubai";
        dept4.Description = "This is Description Text 4";

        Department dept5 = new Department();
        dept5.DeptId = 5;
        dept5.DepartmentName = "Defence";
        dept5.Phone = "+1 555 888 999";
        dept5.Country = "Australia";
        dept5.City = "Sydney";
        dept5.Description = "This is Description Text 5";

        Department dept6 = new Department();
        dept6.DeptId = 6;
        dept6.DepartmentName = "Socialogy";
        dept6.Phone = "+1 555 777 000";
        dept6.Country = "United States";
        dept6.City = "New York";
        dept6.Description = "This is Description Text 6";

        deptList.Add(dept);
        deptList.Add(dept2);
        deptList.Add(dept3);
        deptList.Add(dept4);
        deptList.Add(dept5);
        deptList.Add(dept6);

        return Json(deptList, JsonRequestBehavior.AllowGet);
    }
  }
}

请求链接

GetEmployees?take=2&skip=0&page=1&pageSize=2&filter%5Blogic%5D=and&filter%5Bfilters%5D%5B0%5D%5Bfield%5D=DeptId&filter%5Bfilters%5D%5B0%5D%5Boperator%5D=eq&filter%5Bfilters%5D%5B0%5D%5Bvalue%5D=3

目前，我能够使用HttpRequestWrapper在服务器端获取过滤器，如下面GetEmployeesJSONResult中所述

int deptId = Convert.ToInt16(Request.Params["filter[filters][0][value]"]);

但有没有更好的方法在服务器端获取这些过滤器？例如，使用DataSourceRequest

---

谢谢。

这对我来说适用于服务器端过滤。尝试在变量类型之前添加

[DataSourceRequest]

标记，以解决筛选器绑定问题并处理筛选。您可以使用

Kendo.Mvc.Extensions提供的扩展名
ToDataSourceResult（）

[AcceptVerbs(HttpVerbs.Get | HttpVerbs.Post)]
public ActionResult Read([DataSourceRequest] DataSourceRequest request)
{
    // removed for brevity 
    // .......

    return Json(viewModels.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

希望有帮助。
在数据源中使用
键入：“aspnetmvc ajax”
而不是
键入：“json”
，并在控制器中使用
[DataSourceRequest]
属性

publicjsonresult-GetEmployees（[DataSourceRequest]DataSourceRequest命令）
最后，在反复思考之后，我找到了解决方案

在我上面提到的代码中

在$scope.detailGridOptions中替换：（telerikGridController）

与：

take:2
skip:0
page:1
pageSize:2
filter[logic]:and
filter[filters][0][field]:DeptId
filter[filters][0][operator]:eq
filter[filters][0][value]:3

dataSource: {
    type: "aspnetmvc-ajax",
    transport: {
        read: "Grid/GetEmployees",
        type: "POST",
        dataType: "json",
        contentType: "application/json; charset=utf-8"
      },
 schema:
     {
       data: "Data",
       total: "Total",
       errors: "Errors"
      },
   pageSize: 2,
   serverPaging: true,
   serverSorting: true
 },

和在Asp.NET MVC控制器中：

[HttpGet]
public JsonResult GetEmployees(DataSourceRequest command)

更换

[HttpGet]
public JsonResult GetEmployees(DataSourceRequest command)

与

[HttpPost]
public JsonResult GetEmployees(DataSourceRequest command)

一切都会开始工作。每次在DataSourceRequest对象中都会收到筛选器/排序等。
DataSourceRequest筛选器仍然为空。您能提供使用angularjs和asp.net mvc的任何示例吗？请尝试在父网格选项中添加
serverFiltering:true
，我认为我可能需要使用parameterMap？我是的，我将如何使用它？我已经解决了这个问题，但现在我面临分页问题。请帮助我尝试过，但这不起作用，筛选器仍然为空。我认为我可能需要使用parameterMap。如果是，我将如何使用它？我已经解决了这个问题，但现在我面临分页问题，请帮助
[HttpPost]
public JsonResult GetEmployees(DataSourceRequest command)