Question

我正在使用kendo Grid，但我遇到的问题是我无法使用来自webservice plz的数据绑定我的网格帮助我

我的网络服务看起来像这样

[WebMethod]
       public string GetCustomers()
        {
            string data = default(string);
            using (var documentStore = new DocumentStore { Url = "http://haseeb-pc:8080/" }.Initialize())
            {
                using (var session = documentStore.OpenSession())
                {
                    var query = session.Query<Customer>().Select(customer => new
                                                                                 {
                                                                                     FirstName = customer.FirstName,
                                                                                     LastName = customer.LastName,
                                                                                     Email = customer.Email,
                                                                                 }).Take(20);
                    var serializer = new JavaScriptSerializer();
                    return serializer.Serialize(query);
                }
            }
        }

我有一个html页面有一个div

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="../Scripts/jquery-1.7.min.js" type="text/javascript"></script>
    <script src="../Scripts/KendoScript.js" type="text/javascript"></script>
    <script src="../Scripts/KendoScripts/kendo.all.min.js" type="text/javascript"></script>
    <link href="../Scripts/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
    <link href="../Scripts/styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
    <script src="../Scripts/KendoScripts/kendo.web.min.js" type="text/javascript"></script>
</head>
<body>
    <div id="CustomerGridView">
    </div>
</body>
</html>

现在终于我的脚本文件是这样的：

$(function () {
    alert("Welcome To Kendo");
    var dataSource = new kendo.data.DataSource(
            {
                transport: {
                    read: {
                        contentType: "application/json; charset=utf-8",
                        type: "POST",
                        dataType: "json",
                        url: "/CustomerService.asmx/GetCustomers"


                    }
                },
                pageSize: 10,
                schema: {
                    data: "d"
                }
            });

    alert(dataSource);
    $("#CustomerGridView").kendoGrid({
        dataSource: dataSource,
        height: 250,
        scrollable: true,
        sortable: true,
        pageable: true,
        columns: [
        { field: "FirstName", title: "First Name" },
        { field: "LastName", title: "Last Name" },
        { field: "Email", title: "Email" }


        ],
        editable: "popup",
        toolbar: ["create"]
    });

});

我的问题是我的kendo网格没有绑定plz帮我绑定我的网格

Answer 1

尝试将GetCustomers的返回类型更改为Object而不是String，并且不返回“query”的序列化版本。只需返回“查询”。

Answer 2

这是一个显示将Kendo Grid绑定到ASMX服务的项目：https://github.com/telerik/kendo-examples-asp-net/tree/master/grid-web-service-crud

Answer 3

你可以试试这个。

调用服务，使用var对象存储服务内容。

var xhReq = new XMLHttpRequest();
xhReq.open("POST", '/CustomerService.asmx/GetCustomers', false);
xhReq.send(null);
var jsonObject = JSON.parse(xhReq.responseText);

创建kendo数据源，使用var对象作为数据。

var dataSource = new kendo.data.DataSource({
                        page: 1,
                        pageSize: 10,
                        data: jsonObject,
                        schema: {
                            model: {
                                id: "ID", // model id
                                fields: {
                                  //FirstName: { type: "string", editable: false,/*other attributes*/ },
                                  /*your fields*/
                                }
                            }
                        }
                });

将您的kendogrid与kendo数据源绑定

  $("#CustomerGridView").kendoGrid({
        dataSource: dataSource,
        height: 250,
        scrollable: true,
        sortable: true,
        pageable: true,
        columns: [
        { field: "FirstName", title: "First Name" },
        { field: "LastName", title: "Last Name" },
        { field: "Email", title: "Email" }


        ],
        editable: "popup",
        toolbar: ["create"]
    });

});

我希望这可以帮助你:)。

使用Webservice绑定Kendo Grid

3 个答案: