如何使用JSON从jqgrid加载数据
How to load data from jqgrid using JSON
最初,我创建了一个one-json消息,并将其保存在一个变量中,然后尝试将这些数据加载到网格中,这很好。Theni尝试使用JSON,但只得到Loading消息。我不知道我做错了什么。当签入firebug
时,我可以看到来自服务器的json消息。
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/jquery-ui-1.8.16.css" />
<link rel="stylesheet" href="css/ui.jqgrid.css" />
<script src="scripts/jquery-1.6.3.min.js"></script>
<script src="scripts/jquery-ui-1.8.16.min.js"></script>
<script src="scripts/grid.locale-en.js"></script>
<script src="scripts/jquery.jqGrid.min.js"></script>
</head>
<body>
<h1>hey</h1>
<table id="list"></table>
</body>
<script>
$(function () {
$("#list").jqGrid({
url: "/xyz/filteredUsersAsJson",
datatype: "json",
mtype: "GET",
colNames: ["Username", "User Type", "Full Name", "Telephone", "Email", "Region","Action"],
colModel: [
{ name: "UserName", width: 55 },
{ name: "UserType", width: 90 },
{ name: "FullName", width: 80, align: "right" },
{ name: "Contact", width: 80, align: "right" },
{ name: "Email", width: 80, align: "right" },
{ name: "Region", width: 150, sortable: false },
{ name: "", width: 150 }
],
pager: "#pager",
rowNum: 10,
rowList: [10, 20, 30],
sortname: "UserName",
sortorder: "asc",
viewrecords: true,
height: "100%",
width: 940,
shrinkToFit: true,
multiselect: true,
toppager: true,
gridview: true,
loadui:'block',
autoencode: true,
caption: "Users",
jsonReader: {
repeatitems: false,
id: "UserName",
cell: "",
root: function (obj) { return obj; },
page: function (obj) { return 1; },
total: function (obj) { return 1; },
records: function (obj) { return obj.length; }
}
});
});
</script>
</html>
json消息:
{
"page":"1",
"total":2,
"records":"13",
"rows": [{"UserName":"achauhan","UserType":"1","FullName":"1","Contact":"1","Email":"1","Region":"1"},
{"UserName":"amnu","UserType":"2","FullName":"2","Contact":"2","Email":"2","Region":"1"},
{"UserName":"frt","UserType":"3","FullName":"3","Contact":"3","Email":"3","Region":"1"},
{"UserName":"sdsds","UserType":"4","FullName":"4","Contact":"4","Email":"4","Region":"1"},
{"UserName":"sdsd","UserType":"5","FullName":"5","Contact":"5","Email":"5","Region":"1"}]
}
更新
您在jsonReader声明中有一些错误,它一定是这样的:
jsonReader: {
repeatitems: false,
id: "UserName",
cell: "",
root: function (obj) { return obj.rows; },
page: function (obj) { return 1; },
total: function (obj) { return 1; },
records: function (obj) { return obj.records; }
}
我已经测试过了,它有效。
-
原始浏览器
如何使用本地数据从jqgrid加载数据
如果您想使用本地数据,您必须替换:
url: "/xyz/filteredUsersAsJson", datatype: "json", mtype: "GET"
带有datatype: "local", data: yourVariableWithLocalData
jsonReader
与localReader
尝试更改:
$("#list").jqGrid
至
$("#jqgrid").jqGrid
相关文章:
- 正在等待呈现图表,直到加载数据为止
- ng绑定和ng href问题.ng href未从控制器加载数据
- 单击按钮时加载数据
- 在reactjs组件中预加载数据
- Highcharts可以从服务器加载数据,但不能更新
- AngularJS promise在加载数据之前得到解决
- 在Knockout JS中搜索从DB加载数据的项目
- 如何在angular js中使用$emit后重新加载数据
- 构建多个图表时,HighCharts加载数据的速度较慢
- 加载初始网站后在后台加载数据
- ExtJS网格未从Ext.data.XmlStore加载数据
- 数据表 AJAX 筛选器重新加载数据
- select2 使用 AJAX 加载数据不能选择任何选项
- 在 Metro 风格应用中启动时加载数据
- 需要帮助使用 AJAX 和其他一些东西加载数据
- Vue 不加载数据
- 向右滚动加载数据
- 为SEO的数据绑定JS预加载数据
- mysql循环-预加载数据
- 无法使用JSON加载数据表