Как использовать 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)\/"}
]
}

Ура, Уильям Райли-Лэнд

Answer 1

Прежде чем делать что-либо еще, скачайте и установите это:

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

Это позволит вам точно увидеть, что запрашивается и отсылается обратно запросами jqGrid для получения данных JSON.

У меня есть код для работающей jqGrid, и вот что-то другое:

datatype: "json"

Вместо вашего:

datatype: "jsonstring"

У меня также есть поле с именем colNames, которое представляет собой массив строк, содержащих имена столбцов.

Наконец, у меня есть поле pager, которое идентифицирует элемент, который будет хранить элементы управления подкачкой, и является DIV.

Answer 2

Будьте внимательны со свойством, чувствительным к регистру тип данных означает dataType с прописными буквами T .

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

В ASP.NET Date сериализуется как JSON "/ Date (ticks) /" , что не может быть интерпретировано jqGrid. Возможные решения ( сообщение ):

• написать собственный форматер для сетки
• изменить данные, которые мы отправляем в сетку (отправив отформатированную дату в виде строки)

Скажите, пожалуйста, как вы реализовали отображение даты с помощью jqGrid?

Спасибо.

Answer 5

Если у вас проблемы с настройкой jqGrid для работы с ASP.NET, посмотрите здесь . Это должно сэкономить вам много времени.