如何將jqGrid與C＃/ ASP.NET和JSON.NET（以及沒有AJAX.NET的東西）一起使用？

Question

好的，我已經調查了幾天，並不是特別肯定我做錯了什么。 如果有人有使用jqGrid與C＃/ ASP.NET和開源工具的工作示例，請告訴我在哪里找到它們。 任何關於找到合適的文檔或工具的技巧我都可以用來調試這個也很受歡迎（我對js / jQuery很新）。 基本上我只需要編輯就地功能，所以如果我忽略了另一個明顯的解決方案，那么知道......我想盡可能避免使用AJAX.NET。

我覺得我只是忽略了一些非常明顯的東西。

在下面的示例中，我確實要顯示jqGrid，但它沒有顯示數據。

這是相關的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" 
    });  
});

---

HTML：

<table id="role_assignment_table" class="scroll" cellpadding="0" cellspacing="0" />

---

生成的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)\/"}
]
}

干杯，William Riley-Land

Answer 1

在做任何其他事情之前，請下載並安裝：

http://www.fiddler2.com/fiddler2/

它將讓您准確了解jqGrid請求所請求和發回的內容以獲取JSON數據。

我有一些工作jqGrid的代碼，這里有一些不同的東西：

datatype: "json"

而不是你的：

datatype: "jsonstring"

我還有一個名為colNames的字段，它是一個包含列名的字符串數組。

最后，我有一個pager字段，用於標識將存儲分頁控件的元素，並且是一個DIV。

Answer 2

在ASP.NET中，Date被序列化為JSON “/ Date（ticks）/” ，jqGrid無法解釋。 可能的解決方案（ 帖子 ）：

• 為網格編寫自定義格式化程序
• 更改我們發送到網格的數據（通過將格式化日期作為字符串發送）

請告訴我你是如何用jqGrid實現日期顯示的？

謝謝。

Answer 3

我有完全相同的問題！ 我想出的解決方案是創建一個自定義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]*)\)\//, '$1');
    var date = new Date();
    date.setTime(time);
    return date.toDateString();
}

Answer 4

注意區分大小寫的屬性數據類型應該是帶有大寫T的 dataType 。

Answer 5

如果您在使用jqGrid處理ASP.NET時遇到問題，請查看此處 。 這應該可以節省你很多時間。