62,046
社区成员
发帖
与我相关
我的任务
分享ASP.NET 传json数据给JqGrid 不显示！！！！
我使用JqGrid表格插件进行数据的显示，服务端能够返回json数据，但是html端的jqGrid表格不能够显示。具体如下：
hml代码：
ashx代码
FireBug返回的数据为：
{"page" : '1', "total" : '20', "records" : '10', "grids":[{"GprsID":"99610010037","DeviceName":"隔离测试_
不要删除","DeviceType":"开关"},{"GprsID":"99610010038","DeviceName":"测试2设备","DeviceType":"开关"}]}
我觉得是jqGrid插件我哪里没有设置正确？可以确定的是C#从后台数据库中获得了数据！怎么设置jqGrid以正确的显示呢？
求助！！！！！！！！
hml代码：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<link type="text/css" href="css/jquery-ui.min.css" rel="stylesheet" />
<link type="text/css" href="plugins/jquery.jqGrid-4.4.3/css/ui.jqgrid.css" rel="stylesheet" />
<script type="text/javascript" src="plugins/jquery.jqGrid-4.4.3/js/jquery-1.7.2.min.js"></script>
<!--<script type="text/javascript" src="plugins/jquery.jqGrid-4.4.3/js/jquery.jqGrid.min.js"></script>-->
<script type="text/javascript" src="plugins/jquery.jqGrid-4.4.3/js/jquery.jqGrid.src.js"></script>
<script type="text/javascript" src="plugins/jquery.jqGrid-4.4.3/js/i18n/grid.locale-cn.js"></script>
<script type="text/javascript">
$(function () {
$("#jqGrid").jqGrid({
url: "handler/msgSettings.ashx",
datatype: "json",
mtype: "GET",
colNames: ['GprsID', 'DeviceName', 'DeviceType'],
colModel: [
{ name: 'GprsID', width: 20 },
{ name: 'DeviceName', width: 80 },
{ name: 'DeviceType', width: 80 }
],
viewrecords: true, // show the current page, data rang and total records on the toolbar
width: 780,
height: 700,
rowNum: 10,
loadonce: true, // this is just for the demo
sortname: '_id',
sortorder: 'desc',
caption: "设备列表",
pager: "#jqGridPager",
jsonReader: { // 用于设置如何解析从Server端发回来的json数据
root:"grids",
page: "page", // json中代表当前页码的数据
total: "total", // json中代表页码总数的数据
records: "records", // json中代表数据行总数的数据
repeatitems: false//注意此时的json结构
},
prmNames: { // 默认设置——如何将Grid所需要的参数传给Server
page:"page", // 表示请求页码的参数名称
rows:"rows", // 表示请求行数的参数名称
sort: "sidx", // 表示用于排序的列名的参数名称
order: "sord", // 表示采用的排序方式的参数名称
search:"_search", // 表示是否是搜索请求的参数名称
nd:"nd", // 表示已经发送请求的次数的参数名称
id:"id", // 表示当在编辑数据模块中发送数据时，使用的id的名称
oper:"oper", // operation参数名称（我暂时还没用到）
editoper:"edit", // 当在edit模式中提交数据时，操作的名称
addoper:"add", // 当在add模式中提交数据时，操作的名称
deloper:"del", // 当在delete模式中提交数据时，操作的名称
subgridid:"id", // 当点击以载入数据到子表时，传递的数据名称
npage: null,
totalrows:"totalrows" // 表示需从Server得到总共多少行数据的参数名称，参见jqGrid选项中的rowTotal
}
});
});
</script>
</head>
<body>
<table id="jqGrid"></table>
<div id="jqGridPager"></div>
</body>
</html>
ashx代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Text;
using UnsionService.model;
using UnsionService.Interface;
using System.Web.Script.Serialization;// for json serialization
using System.Collections.Specialized;
namespace UnsionService.Web.MG.handler
{
public class msgSettings : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string page = context.Request["page"];
string records = context.Request["rows"];
string totalPage = "20";
string jsonStr = GetSwitchDeviceInfoJson(page, totalPage, records);
context.Response.Write(jsonStr);
}
private string GetSwitchDeviceInfoJson(string page, string totalPage, string records)
{
List<Switch_Device> list = UnsionService.Interface.Switch_DeviceDao.Instance.GetSwitches();
StringBuilder outSb = new StringBuilder ();
outSb.Append("{\"page\" : '" + page + "', \"total\" : '" + totalPage + "', \"records\" : '" + records + "', \"grids\":");
List<Dictionary<string, string>> infoList = new List<Dictionary<string, string>>(list.Count);
for (int i = 0; i < list.Count; i++)
{
Dictionary<string, string> tmpDict = new Dictionary<string, string>();
tmpDict.Add("GprsID", list[i].GprsID);
tmpDict.Add("DeviceName", list[i].DeviceName);
tmpDict.Add("DeviceType", "开关");
infoList.Add(tmpDict);
}
JavaScriptSerializer serializer = new JavaScriptSerializer();
StringBuilder deviceInfoSb = new StringBuilder();
serializer.Serialize(infoList, deviceInfoSb);
outSb.Append(deviceInfoSb);
outSb.Append("}");
return outSb.ToString();
}
public bool IsReusable
{
get
{
return false;
}
}
}
}FireBug返回的数据为：
{"page" : '1', "total" : '20', "records" : '10', "grids":[{"GprsID":"99610010037","DeviceName":"隔离测试_
不要删除","DeviceType":"开关"},{"GprsID":"99610010038","DeviceName":"测试2设备","DeviceType":"开关"}]}
我觉得是jqGrid插件我哪里没有设置正确？可以确定的是C#从后台数据库中获得了数据！怎么设置jqGrid以正确的显示呢？
求助！！！！！！！！
...全文
请发表友善的回复…
发表回复
酱君不吃菜 2017-03-24
- 打赏
- 举报
解决了吗？说说
爱吃鸡的程序员 2016-12-31
- 打赏
- 举报
先检查下自己返回的是不是json格式，看是看不出来的，jqgrid对json要求很严格的，之前我就用过，都是按着官方文档一步一步写的，放过和你一样的错，最后检查就是json 格式不对。
BigoSprite 2016-12-30
- 打赏
- 举报
控制台没有错误；返回的数据格式有问题
BigoSprite 2016-12-30
- 打赏
- 举报
试了，还是不行。jqGrid对json的格式要求很严格。。。。
EnForGrass 2016-12-30
- 打赏
- 举报
首先你的看控制台js报错没？有报错那估计写的有问题，看看官方示例，对比一下啊
Xanl 2016-12-30
- 打赏
- 举报
响应类型设置成json格式
csdnFUCKINGSUCKS 2016-12-30
- 打赏
- 举报
看下官方示例里面返回的数据跟你的有什么不同
正怒月神 版主 2016-12-30
- 打赏
- 举报
colNames: ['GprsID', 'DeviceName', 'DeviceType'],
colModel: [
{ name: 'GprsID', width: 20 },
{ name: 'DeviceName', width: 80 },
{ name: 'DeviceType', width: 80 }
],columns: [[
{ field: 'GprsID', title: 'GprsID' },
{ field: "DeviceName", title: "DeviceName", width: "60" },
{ field: "DeviceType", title: "DeviceType", width: "60" }
]]sy401042879 2016-12-30
- 打赏
- 举报
"page" : '1', "total" : '20', "records" : '10',
这块不对，数值应该用双引号吧。
sy401042879 2016-12-30
- 打赏
- 举报
试了，还是不行。jqGrid对json的格式要求很严格。。。。[/quote]
用http://www.bejson.com/这个检查下你返回的json，然后在和官网的对比下即可。
