如何将 jqGrid 与 C#/ASP.NET 和 JSON.NET（没有 AJAX.NET 的东西）一起使用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1045870/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to use jqGrid with C#/ASP.NET and JSON.NET (and no AJAX.NET stuff)?
提问by wprl
OK, I've been looking into this a few days and am not particularly sure what I am doing wrong. If anyone has working examples of using jqGrid with C#/ASP.NET and open source tools, please, please let me know where to find them. Any tips on finding decent documentation or tools I could use to debug this would be most appreciated too (I'm pretty new to js/jQuery). Basically I just need the edit-in-place functionality, so if I'm overlooking another obvious solution for that, it could be helpful to know... I'd like to avoid using AJAX.NET if at all possible.
好的，我已经研究了几天，但不是特别确定我做错了什么。如果有人有将 jqGrid 与 C#/ASP.NET 和开源工具一起使用的工作示例，请告诉我在哪里可以找到它们。任何有关找到我可以用来调试的体面文档或工具的提示也将不胜感激（我对 js/jQuery 还很陌生）。基本上我只需要就地编辑功能，所以如果我忽略了另一个明显的解决方案，知道它可能会有所帮助......如果可能的话，我想避免使用 AJAX.NET。
I feel like I'm just overlooking something really obvious here.
我觉得我只是在这里忽略了一些非常明显的东西。
In the following example, I do get the jqGrid to display, but it shows no data.
在下面的示例中，我确实让 jqGrid 显示，但它不显示任何数据。
Here is the relevant JavaScript:
这是相关的 JavaScript：
jQuery(document).ready(function(){
jQuery("#role_assignment_table").jqGrid({
url:'http://localhost:4034/WebSite2/PageItemHandler.asmx/GetPageItemRolesJson?id=3',
mtype: 'GET',
contentType: "application/json; charset=utf-8",
datatype: "jsonstring",
colModel:[
{name:'Id', label:'ID', jsonmap:'Id'},
{name:'Title', jsonmap:'Title'},
{name:'AssignedTo', label:'Assigned To', jsonmap:'AssignedTo'},
{name:'Assigned', jsonmap:'Assigned'},
{name:'Due', jsonmap:'Due'},
{name:'Completed', jsonmap:'Completed'}
],
jsonReader: {
page: "Page",
total: "Total",
records: "Records",
root: "Rows",
repeatitems: false,
id: "Id"
},
rowNum:10,
rowList:[10,20,30],
imgpath: 'js/themes/basic/images',
viewrecords: false,
caption: "Role Assignments"
});
});
The HTML:
HTML：
<table id="role_assignment_table" class="scroll" cellpadding="0" cellspacing="0" />
The generated JSON:I'm not sure if it makes it to the jqGrid, or if the jqGrid doesn't like my JSON or my WebMethod, but I can call it myself when I go to the proper URL and get the JSON result string.
生成的 JSON：我不确定它是否进入 jqGrid，或者 jqGrid 是否不喜欢我的 JSON 或我的 WebMethod，但是当我转到正确的 URL 并获取 JSON 结果字符串时，我可以自己调用它.
{"Page":"1","Total":1.0,"Records":"4",
"Rows":[
{"Id":1,"Item":null,"Title":"Story Manager","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"},
{"Id":2,"Item":null,"Title":"Analysis","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"},
{"Id":3,"Item":null,"Title":"Narrative","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"},
{"Id":4,"Item":null,"Title":"Graphic","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"}
]
}
Cheers, William Riley-Land
干杯，威廉·莱利-兰德
采纳答案by Daniel Earwicker
Before doing anything else, download and install this:
在做任何其他事情之前，先下载并安装这个：
http://www.fiddler2.com/fiddler2/
http://www.fiddler2.com/fiddler2/
It will let you see exactly what is being requested and sent back by the jqGrid requests to get the JSON data.
它将让您确切地看到 jqGrid 请求正在请求和发回的内容，以获取 JSON 数据。
I have some code for a working jqGrid, and here's something different:
我有一些用于工作 jqGrid 的代码，这里有一些不同的东西：
datatype: "json"
Instead of your:
而不是你的：
datatype: "jsonstring"
I also have a field called colNameswhich is an array of strings containing column names.
我还有一个名为的字段colNames，它是一个包含列名的字符串数组。
Finally, I have a pagerfield which identifies an element that will store the paging controls, and is a DIV.
最后，我有一个pager字段，它标识将存储分页控件的元素，并且是一个 DIV。
回答by Ron Harlev
回答by dev
In ASP.NET, Date gets serialized as JSON "/Date(ticks)/"which can not be interpreted by jqGrid. Possible solutions (post):
在 ASP.NET 中，Date 被序列化为 JSON "/Date(ticks)/"，jqGrid 无法解释它。可能的解决方案（帖子）：
- write a custom formatter for the grid
- change the data we send to the grid (by sending formatted date as string)
- 为网格编写自定义格式化程序
- 更改我们发送到网格的数据（通过将格式化日期作为字符串发送）
Please tell how did you implement date display with jqGrid ?
请告诉您如何使用 jqGrid 实现日期显示？
Thank You.
谢谢你。
回答by Jonathan
I had exactly the same problem! The solution I came up with is to create a custom JavaScript formatter:
我遇到了完全相同的问题！我想出的解决方案是创建一个自定义 JavaScript 格式化程序：
$(this).jqGrid({
...
colModel: [
{
name: 'SomeDate', index: 'SomeDate', width: 100, formatter: ndateFormatter }
}],
...
});
// Convert C# json Date.
function ndateFormatter(cellval, opts, rwdat, _act) {
var time = cellval.replace(/\/Date\(([0-9]*)\)\//, '');
var date = new Date();
date.setTime(time);
return date.toDateString();
}
回答by Darryl Hebbes
Be careful with the case sensitive property datatypeis meant to be dataTypewith uppercase T.
注意区分大小写的属性数据类型是带有大写T 的dataType。
