请给我你的建议 .
以下URL提供了jsonp格式的数据:http://demos.kendoui.com/service/Products
但是,只有我做的更改是使用我自己的url指向简单的php来获取jsonp数据,如下所示:
<?php
header('Vary: Accept-Encoding');
header('Connection: Keep-Alive');
header('Content-Encoding: gzip');
header('Content-Length: 1743');
header('Content-Type: application/x-javascript; charset=utf-8');
echo gzencode('callback([{"ProductID":2,"ProductName":"Chang","UnitPrice":19,"UnitsInStock":17,"Discontinued":false}])');
?>
HTML源代码如下:
<!DOCTYPE html> <html> <head> <title>ESS Software Inventory</title> <meta charset="utf-8"> <link href="./kendoui/content/shared/styles/examples-offline.css" rel="stylesheet"> <link href="./kendoui/styles/kendo.common.min.css" rel="stylesheet"> <link href="./kendoui/styles/kendo.rtl.min.css" rel="stylesheet"> <link href="./kendoui/styles/kendo.default.min.css" rel="stylesheet"> <script src="./kendoui/js/jquery.min.js"></script> <script src="./kendoui/js/kendo.web.min.js"></script> <script src="./kendoui/content/shared/js/console.js"></script> <script> </script> </head> <body> <a class="offline-button" href="../index.html">Back</a> <div id="example" class="k-content"> <div id="grid"></div> <script> $(document).ready(function () { var crudServiceBaseUrl = "http://dnettools/essinventory/cgi-bin", //var crudServiceBaseUrl = "http://demos.kendoui.com/service", dataSource = new kendo.data.DataSource({ transport: { read: { url: crudServiceBaseUrl + "/products.php", //url: crudServiceBaseUrl + "/Products", dataType: "jsonp" }, update: { url: crudServiceBaseUrl + "/products.php", dataType: "jsonp" }, destroy: { url: crudServiceBaseUrl + "/products.php", dataType: "jsonp" }, create: { url: crudServiceBaseUrl + "/products.php", dataType: "jsonp" }, parameterMap: function(options, operation) { if (operation !== "read" && options.models) { return {models: kendo.stringify(options.models)}; } } }, batch: true, pageSize: 20, schema: { model: { id: "ProductID", fields: { ProductID: { editable: false, nullable: true }, ProductName: { validation: { required: true } }, UnitPrice: { type: "number", validation: { required: true, min: 1} }, Discontinued: { type: "boolean" }, UnitsInStock: { type: "number", validation: { min: 0, required: true } } } } } }); $("#grid").kendoGrid({ dataSource: dataSource, navigatable: true, pageable: true, height: 430, toolbar: ["create", "save", "cancel"], columns: [ "ProductName", { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: 110 }, { field: "UnitsInStock", title: "Units In Stock", width: 110 }, { field: "Discontinued", width: 110 }, { command: "destroy", title: " ", width: 90 }], editable: true }); }); </script> </div> </body> </html>
1 回答
不得不使用这个:因为返回的jsonp应该有动态回调名称
parse_str($ _ SERVER ['QUERY_STRING']);
echo "$callback" . '([{ 1498857 :1, 1498858 : 1498859 , 1498860 :18, 1498861 :39, 1498862 :false},{ 1498863 :2, 1498864 : 1498865 , 1498866 :19, 1498867 :17, 1498868 :false},{ 1498869 :3, 1498870 : 1498871 , 1498872 :10, 1498873 :13, 1498874 :false},{ 1498875 :4, 1498876 : 1498877 , 1498878 :22, 1498879 :53, 1498880 :false}])';