Kendo Grid 未绑定到来自 ASMX Web 服务的 JSON 结果答案

【问题标题】：Kendo Grid not binding to JSON result from ASMX Web ServiceKendo Grid 未绑定到来自 ASMX Web 服务的 JSON 结果
【发布时间】：2015-07-22 19:41:22
【问题描述】：

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

以下是 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 上仍然看不到任何东西。并且浏览器控制台没有错误。

【问题讨论】：

ASMX 是一项遗留技术，不应用于新开发。 WCF 或 ASP.NET Web API 应该用于 Web 服务客户端和服务器的所有新开发。一个提示：微软已经在 MSDN 上停用了ASMX Forum。
我知道，但是结果JSON没有任何问题，为什么grid没有绑定？@JohnSaunders
这样的事情可能会有所帮助，但它不使用 MVC。stackoverflow.com/a/30183044/2270492

标签： asp.net json kendo-grid asmx

【解决方案1】：

我将 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。这就是它对我的工作方式。

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

谢谢

【讨论】：

【解决方案2】：

我认为问题仅在于 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

【讨论】：

很好，返回的 JSON 来自 asmx 服务。你能告诉我如何在 asmx 级别删除引号和反斜杠引号吗？
您的回复对我帮助很大。我在服务器端没有找到任何东西来删除那些额外的引号。但是我是在 ajax 调用之后在客户端完成的。然后我将该数据传递给 Kendo GRID。它工作得很好。我现在正在发布解决方案。