Kendo Angular Grid ServerSide Paging-Partially Working

时间:2016-04-22 18:23:02

标签: angularjs asp.net-mvc-4 kendo-grid

我如此亲密但到目前为止......

我正在使用带有MVC终点数据的角度剑道网格。我没有问题让数据显示,然后我转向分页。客户端分页工作,但由于记录计数很高,我更喜欢服务器端分页。

这是我遗漏的地方。我的网格显示"显示18 of 18"所以它以某种方式解析网格图例的计数,但实际网格显示所有18行??

我的_layout还有其他文件:

<script src="@Url.Content("~/Scripts/kendo/2016.1.412/kendo.aspnetmvc.min.js")"></script>

我的网格:

$("<div/>").appendTo(e.detailCell).kendoGrid({
                dataSource: {
                    transport: {
                        read: function (f) {
                            $http.get('http://localhost:59722/SCat/GetSubCategories?categoryid=' + e.data.Id).
                            success(function (data, status, headers, config) {
                            f.success(data)
                            }).
                            error(function (data, status, headers, config) {
                            alert('something went wrong with subCategories')
                            console.log(status);
                            });
                        },
                        create: function (c) {
                            alert('adf');
                            $http.post('http://localhost:59722/Cat/AddNewSubCategory').
                            success(function (data, status, headers, config) {
                            f.success(data)
                            }).
                            error(function (data, status, headers, config) {
                            alert('something went wrong with update')
                            console.log(status);
                        });
                        }
                    },
                    pageSize: 5,
                    serverPaging: true,
                    serverFiltering: true,
                    schema: {
                        data: "Data",
                        total: "Total",
                        errors: "Errors"
                    }
                },
                pageable: true,
                filterable: true,
                editable: "inline",
                toolbar: ["create"],
                columns: [
                    { field: "SubCategoryName", title: "Category Name" },
                    { field: "SCategoryId", title: "Parent Id" },
                    { command: ["edit"]}
                ]
            })
        }

    })

MVC行动:

public async Task<JsonResult> GetSubCategories([DataSourceRequest] DataSourceRequest request,  int? categoryid)
{
        int categoryId = categoryid ?? -9999;
        if (categoryId == -9999)
        { return Json("[{Error -9999 for categoryId}]"); }


        HttpResponseMessage responseMessage = await client.GetAsync(url + "/" + categoryId);
        if (responseMessage.IsSuccessStatusCode)
        {
            var responseData = responseMessage.Content.ReadAsStringAsync().Result;
            var x = JsonConvert.DeserializeObject<List<SubCategories>>(responseData);

            return Json(x.ToDataSourceResult(request) , JsonRequestBehavior.AllowGet);

        }

        return Json("[{Error}]");
     }

Fiddler 220 Json:

{ "Data":[
    {"Id":1,"SubCategoryName":"asdfe","CategoryId":1},
    {"Id":3,"SubCategoryName":"Self-Righteousness","CategoryId":1},
    ...removed brevity...
    {"Id":18,"SubCategoryName":"Viuyhj","CategoryId":1} 
    {"Id":19,"SubCategoryName":"zcxv","CategoryId":1}
    ],
"Total":18,
"AggregateResults":null,
"Errors":null}

现在我想我的角网格中缺少一些东西,因为我的DataSourceRequest总是充满默认值。

此外,如果我明确指定页面值,一切正常。

public async Task<JsonResult> GetSubCategories([DataSourceRequest] DataSourceRequest request,  int? categoryid)
{
  request.PageSize = 5;
  ....snip
}

所以它与我的Angular网格有关,但我错过了什么???

1 个答案:

答案 0 :(得分:0)

我也将这个发布到Telerik论坛。他们回答了我所缺少的一切。

http://www.telerik.com/forums/angular-grid-datasourcerequest-pagesize-etc-always-default-values