巨大的数据没有绑定到剑道网格

时间:2014-10-30 10:38:08

标签: asp.net-mvc kendo-ui kendo-grid

我只是在我的应用程序中使用kendo网格,并且我需要在网格中显示公司的2500条记录。但是当我尝试绑定较少的数据(如200)时它运行良好,但是当我尝试绑定2500条记录时它没有显示任何数据('没有要显示的项目')

要显示的网格:

 <div id="divSearchResult" >

 </div>

kendo bind:

 <script>
        function BindGridSearchResult(data)
        {
            $("#divSearchResult").kendoGrid({
                dataSource: data,
                navigatable: true,
                pageable: true,


                //toolbar: ["create", "save", "cancel"],
                columns: [

                    { field: "UnitID", title: "UnitID", width: 110, hidden: true },
                    { field: "Nickname", title: "Nickname", width: 110 },
                { field: "ContractNumber", title: "ContractNumber", width: 110 },
        { field: "SerialNumber", title: "SerialNumber", width: 110 },
        { field: "UnitPriority", title: "UnitPriority", width: 110 },
        { field: "Address1", title: "Address1", width: 110 },
        { field: "City", title: "City", width: 110 },
        { field: "Region", title: "Region", width: 110 }]


            });

        }
    </script>

Ajax调用获取数据:

$.ajax({
            url: "/Admin/GetSearchUnit",
            data: Data,
            success: function (result)
            {
                debugger;
                BindGridSearchResult(result);
                //alert("Success");
            },
            erro: function (error, err) {
                alert("Failed");
            },

        })

减少数据:enter image description here

巨大的数据:

enter image description here

请帮我解决这个问题..

提前谢谢..

1 个答案:

答案 0 :(得分:3)

你可以使用带分页的Ajax绑定,这对于Kendo网格是开箱即用的,如下所示:

@(Html.Kendo().Grid<SearchUnit>()
  .Name("divSearchResult")
  .DataSource(dataSource => dataSource // Configure the grid data source
      .Ajax() // Specify that ajax binding is used
      .Read(read => read.Action("GetSearchUnit", "Admin")) 
   )
  .Columns(columns =>
  {
      columns.Bound(searchunit => searchunit.ID);
      columns.Bound(searchunit => searchunit.Name);
  })
  .Pageable() // Enable paging
  .Sortable() // Enable sorting
)

这样您可以将数据接收到页面中,以下是您应该如何实现服务器端:

public ActionResult GetSearchUnit([DataSourceRequest]DataSourceRequest request)
{
    using (var _db = new DatabaseEntities())
    {
        IQueryable<SearchUnit> unitslist = _db.units;
        DataSourceResult result = unitslist.ToDataSourceResult(request);
        return Json(result);
    }
}