Kendo 网格未绑定到来自 ASMX Web 服务的 JSON 结果

Kendo Grid not binding to JSON result from ASMX Web Service

我在将 Kendo GRID 绑定到 ASP.NET asmx 网络服务时遇到问题。

以下是HTML代码

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" href="styles/kendo.common.min.css" />
    <link rel="stylesheet" href="styles/kendo.default.min.css" />
    <link rel="stylesheet" href="styles/kendo.dataviz.min.css" />
    <link rel="stylesheet" href="styles/kendo.dataviz.default.min.css" />
    <link href="styles/kendo.common-bootstrap.min.css" rel="stylesheet" />
    <link href="styles/kendo.bootstrap.min.css" rel="stylesheet" />
    <link href="../BOOTSTRAP/bootstrap.min.css" rel="stylesheet" />
    <script src="../Scripts/jquery-2.0.3.min.js"></script>
    <script src="js/kendo.all.min.js"></script>
    <script src="../BOOTSTRAP/bootstrap.min.js"></script>
</head>
<body>

    <div id="example">
        <div id="grid" class="table table-bordered"></div>
        <script>
            $(document).ready(function () {
                $("#grid").kendoGrid({
                    columns: [
            { field: "srno", title: "SRNO" },
            { field: "party", title: "PARTY" }
                    ],
                    dataSource: new kendo.data.DataSource({
                        transport: {
                            read: {
                                url: "../Service/DatabaseHandling.asmx/GetPurchaseJangad_JSON",
                                dataType: "json",
                                contentType: "application/json; charset=utf-8"
                            }
                        }
                    }),
                    schema: {
                        data: "d"

                    },
                    sortable: true
                });
            });
        </script>
    </div>


</body>
</html>

JSON 从服务返回看起来正常,如下所示。

{"d":"[{\"srno\":17,\"party\":\"PARESH\",\"dt\":\"11/5/2015\",\"weight\":15000.0,\"timestamp\":\"2015-05-11T20:19:55.093\"},{\"srno\":18,\"party\":\"SIM\",\"dt\":\"11/5/2015\",\"weight\":11000.0,\"timestamp\":\"2015-05-11T20:21:44.177\"}]"}

GRID 上仍然看不到任何内容。 并且浏览器控制台没有错误。

我认为问题仅出在 JSON 数据上。

修改了下面给出的 JSON,将 \" 替换为 " 并删除了方括号前后的引号

{"d":[{"srno":17,"party":"PARESH","dt":"11/5/2015","weight":15000.0,"timestamp":"2015-05-11T20:19:55.093"},{"srno":18,"party":"SIM","dt":"11/5/2015","weight":11000.0,"timestamp":"2015-05-11T20:21:44.177"}]}

Please find the fiddle here after cleaning up the json

我将 jQuery 代码更改为以下代码。

$(document).ready(function () {
        var data;
        var webMethod = "../Service/DatabaseHandling.asmx/GetPurchaseJangad_JSON";
        var parameters = "{}";
        $.ajax({

            contentType: "application/json; charset=utf-8",
            url: webMethod,
            data: parameters,
            dataType: "json",
            success: function (response) {
                data = $.parseJSON(response.d);
                console.log(data);
                $("#grid").kendoGrid({
                    columns: [
            { field: "srno", title: "SRNO" },
            { field: "party", title: "PARTY" },
            { field: "dt", title: "DATE" },
            { field: "weight", title: "WEIGHT" }
                    ],
                    dataSource: {
                        transport: {
                            read: function (options) {
                                options.success(data);
                            }
                        },
                        schema: {

                        }
                    }
                });
            }
        });

    });

我所做的是通过 jQuery ajax 调用的服务。得到包含反斜杠和引号的数据。然后在代码中,使用 $.parseJSON 获得所需的 JSON 格式。然后在成功后将该数据传递给 Kendo GRID。这就是它为我工作的方式。

但如果可能的话,我仍在寻找一种在服务器端执行此操作的方法。

谢谢