При использовании формата jqGrid json строка не добавляется

Question

Я только начинаю использовать jqgrid, но когда я пробую самый простой пример (загрузка данных JSON), он не работает (строка не добавлена ​​в tbody)

Я загружаю эти файлы в главном разделе

<link rel="stylesheet" type="text/css" href="http://192.168.3.9/wavinet2-permana/application/themes/default/css/jqueryui/jquery-ui-1.8.8.custom.css">

<script src="http://192.168.3.9/wavinet2-permana/application/themes/default/js/jquery-1.4.4.min.js" type="text/javascript"></script>

<script src="http://192.168.3.9/wavinet2-permana/application/themes/default/js/jquery-ui-1.8.8.custom.min.js" type="text/javascript"></script>

<link rel="stylesheet" type="text/css" href="/wavinet2-permana/application/assets/css/jqgrid/ui.jqgrid.css">

<script src="/wavinet2-permana/application/assets/js/jqgrid/i18n/grid.locale-id.js" type="text/javascript"></script>

<script src="/wavinet2-permana/application/assets/js/jqgrid/jquery.jqGrid.min.js" type="text/javascript"></script>

И у меня есть javascript для загрузки и настройки jqgrid

<script type="text/javascript">
$('#list2').jqGrid({
url: SITE_URL+'/account/test/jqgrid_ajax',
dataType: 'json',
mtype: 'GET',
colNames: ['Username', 'Nama Person'],
colModel: [
{name:'username', index: 'username', width:200, key:true},
{name:'nama_person', index: 'nama_person', width:200}
],
rowNum: 10,
rowList: [10, 20, 30],
pager: '#pager2',
sortname: 'username',
sortorder: 'ASC',
caption: 'Account Example',
viewrecords: true,
jsonReader: {repeatitems: false}
});
$('#list2').jqGrid('navGrid','#pager2',{edit:false,add:false,del:false}); 
</script>

корпус

<table id="list2" width="100%"></table>
<div id="pager2"></div>

JSON-ответ

{
   "page":"1",
   "total":"2",
   "records":"13",
   "rows":[
      {
         "id":"Oke1",
         "cell":[
            "Oke1",
            "Deh"
         ]
      },
      {
         "id":"Oke2",
         "cell":[
            "Oke2",
            "Deh"
         ]
      },
      {
         "id":"Oke3",
         "cell":[
            "Oke3",
            "Deh"
         ]
      },
      {
         "id":"Oke4",
         "cell":[
            "Oke4",
            "Deh"
         ]
      },
      {
         "id":"Oke5",
         "cell":[
            "Oke5",
            "Deh"
         ]
      },
      {
         "id":"Oke6",
         "cell":[
            "Oke6",
            "Deh"
         ]
      },
      {
         "id":"Oke7",
         "cell":[
            "Oke7",
            "Deh"
         ]
      },
      {
         "id":"Oke8",
         "cell":[
            "Oke8",
            "Deh"
         ]
      },
      {
         "id":"Oke9",
         "cell":[
            "Oke9",
            "Deh"
         ]
      },
      {
         "id":"Oke10",
         "cell":[
            "Oke10",
            "Deh"
         ]
      }
   ]
}

Я пытаюсь открыть в Firefox Windows, Firefox Ubuntu и Internet Explorer 8, он возвращает тот же результат. Сетка отрисована, но нет данных о теле

Answer 1

Я вижу две небольшие ошибки в вашем коде:

• вы должны использовать datatype: 'json' вместо dataType: 'json', который вы, вероятно, знаете из jQuery.ajax .
• Вы должны удалить jsonReader: {repeatitems: false} параметр.

См. демо .

Я рекомендую вам дополнительно использовать jQuery 1.6.2 вместо jQuery 1.4.4, который теперь уже является «ретро» версией. С версией 1.6.3 вы должны быть немного более разумным (см. здесь ). Точно так же jQuery UI 1.8.8 также является старой версией. Я рекомендую вам использовать jQuery UI 1.8.16.