如何在kendo网格中加载大量数据

时间:2012-05-19 14:02:01

标签: jquery asp.net vb.net kendo-ui

网络方法:

   <WebMethod()>
   Public Shared Function Pcpacking() As IEnumerable(Of Packing)
   Dim db As New STOREEntities
   Return db.PC_PACKING_HISTORIES. _
   Where(Function(q) q.PACK_DATE > "1388/11/07"). _
   Select(Function(q) New Packing _
              With {.Packdate = q.PACK_DATE,
                    .Packserialnumber = q.PACK_SERIAL_NUMBER,
                    .Netweight = q.NET_WEIGHT,
                    .Packusername = q.PACK_USER_NAME}).ToList()
   End Function

脚本:

$(function () {
       $("#grid").kendoGrid({
           height: 200,
           columns: [
                { field: "Packserialnumber", width: "150px" },
               { field: "Netweight", width: "50px" },
               { field: "Packusername", width: "150px" },
               { field: "Packdate", width: "100px" }
           ],
           editable: false,
           dataSource: {
               schema: {
                   data: "d",
                   model: {
                       id: "Packserialnumber",
                       fields: {
                           Packserialnumber: { editable: false, nullable: true },
                           Netweight: { type: "number", validation: { required: true, min: 1} },
                           Packusername: { validation: { required: true} },
                           Packdate: { validation: { required: true} }
                       }
                   }
               },
               batch: false,
               transport: {
                   read: {
                       url: "Default.aspx/Pcpacking",
                       contentType: "application/json; charset=utf-8",
                       type: "POST"
                   }
               }
           }
       });
   });

有这个条件(PACK_DATE&gt;“1388/11/07” 366条记录)一切正常。但是当我将日期更改为1388/11/06 1260条记录或1388/11/05 5460条记录或......发生以下错误:

  

{“Message”:“使用JSON JavaScriptSerializer进行序列化或反序列化时出错。字符串的长度超过了值   在maxJsonLength属性上设置。 “,”StackTrace“:”at   System.Web.Script.Serialization.JavaScriptSerializer。   Serialize(Object obj,StringBuilder输出,SerializationFormat   serializationFormat个)\ r \ n       在System.Web.Script.Serialization.JavaScriptSerializer.Serialize(Object   OBJ,        SerializationFormat serializationFormat)\ r \ n          在System.Web.Script.Services.RestHandler.InvokeMethod(HttpContext   背景下,           WebServiceMethodData methodData,IDictionary`2 rawParams)\ r \ n
           在System.Web.Script.Services.RestHandler.ExecuteWebServiceCall(HttpContext   context,WebServiceMethodData methodData)“,            “ExceptionType”: “System.InvalidOperationException”}

我认为剑道网格不支持大量数据。任何建议? 抱歉我的英语不好。

2 个答案:

答案 0 :(得分:2)

问题实际上是默认情况下,如果生成的JSON字符串大于100 kB,.NET JSON序列化程序会抛出异常。显然,发送数千条记录的数量超过限制。你可以change this setting,但我不建议你申请。

相反,将网格配置为一次请求小块数据。看起来你可以configure Kendo Grid to load more data as you scroll

$("#grid").kendoGrid({
    dataSource: {
        type: "odata",
        serverPaging: true,
        serverSorting: true,
        pageSize: 100,
        transport: {
            read: {
                url: "Default.aspx/Pcpacking",
                contentType: "application/json; charset=utf-8",
                type: "POST"
            }
        }
    },
    scrollable: {
        virtual: true
    },

    ...
});

您的服务器端脚本必须处理剑道发送的top(要发送的记录数)和skip(从哪里开始)参数。

答案 1 :(得分:0)

$(function () {
       $("#grid").kendoGrid({
           height: 200,
           columns: [
                { field: "Packserialnumber", width: "150px" },
               { field: "Netweight", width: "50px" },
               { field: "Packusername", width: "150px" },
               { field: "Packdate", width: "100px" }
           ],
           editable: false,
           dataSource: {
               schema: {
                   data: "d",
                   model: {
                       id: "Packserialnumber",
                       fields: {
                           Packserialnumber: { editable: false, nullable: true },
                           Netweight: { type: "number", validation: { required: true, min: 1} },
                           Packusername: { validation: { required: true} },
                           Packdate: { validation: { required: true} }
                       }
                   }
               },
               batch: false,
               transport: {
                   read: {
                       url: "Default.aspx/Pcpacking",
                       contentType: "application/json; charset=utf-8",
                       dataType: "json"
                   }
               }
           }
       });
   });