Отображение данных JSON в JQGrid - PullRequest
Новая
       17

Отображение данных JSON в JQGrid

7 голосов
/ 22 апреля 2010

Я использую jqGrid 3.6.4 и jquery 1.4.2. в моем примере я получаю следующий формат данных json и хочу отобразить эти данные json в строки jqgrid 

{
"page": "1",
"total": 1,
"records": "6",
"rows": [
    {
        "head": {
            "student_name": "Mr S. Jack ",
            "year": 2007

        },
        "sub": [
            {
                "course_description": "Math ",
                "date": "22-04-2010",
                "number": 1,
                "time_of_add": "2:00",
                "day": "today"
            }
        ]

      }
]
}

мой код jqgrid выглядит следующим образом 

jQuery("#"+subgrid_table_id).jqGrid({
url:"http://localhost/stud/beta/web/GetStud.php?sid="+sid,
dtatype: "json",
colNames: ['Stud Name','Year','Date'.'Number'],
colModel: [ {name:'Stud Name',index:'student_name', width:100, jsonmap:"student_name"},
{name:'Year',index:'year', width:100, jsonmap:"year"},
{name:'Date',index:'date', width:100, jsonmap:"date"},
{name:'Number',index:'number', width:100, jsonmap:"number"}
],
height:'100%',
jsonReader: { repeatitems : false, root:"head" },
});

Так что теперь проблема в том, что мои данные, то есть имя_ студента и год находятся под заголовком, jqgrid позволяет найти эти два поля. в то же время другие два значения столбца, т. е. дата и число, находятся под "sub", и даже эти столбцы я не могу сопоставить с jqgrid

, пожалуйста, помогите мне найти эти атрибуты в JQGrid.

Спасибо

1 Ответ

15 голосов
/ 25 апреля 2010

Прежде всего в опубликованном коде есть ошибки типа dtatype: "json" вместо datatype: "json". «},});» вместо «}});» в конце кода и colNames: ['Stud Name','Year','Date'.'Number'] вместо colNames: ['Stud Name','Year','Date','Number']. После исправления этих ошибок вам нужно изменить значения jsonmap. Это был твой главный вопрос. Фиксированный код будет выглядеть следующим образом: 

jQuery("#"+subgrid_table_id).jqGrid({
    ...
    datatype: 'json',
    colNames: ['Stud Name','Year','Date'.'Number'],
    colModel: [
        {name:'student_name', width:100, jsonmap:"head.student_name"},
        {name:'year', width:100, jsonmap:"head.year"},
        {name:'date', width:100, jsonmap:"sub.0.date"},
        {name:'number', width:100, jsonmap:"sub.0.number"}
    ],
    jsonReader: { repeatitems:false, root:"rows" }
});

Вы должны исправить root на "rows" и использовать jsonmap в Точечную запись JSON (см. http://www.trirand.com/jqgridwiki/doku.php?id=wiki:retrieving_data#json_dot_notation). Я использую немного странную запись, такую ​​как "sub.0.number "потому что sub.0.number в JavaScript такой же, как sub[0].number. Теперь он работает.

Я рекомендую вам еще раз подумать о структуре данных JSON, которые вы получаете. (см. мои предыдущие комментарии к вашему вопросу): действительно ли элемент «sub» является массивом с всегда одним элементом, или вы хотите использовать подсетки? Возможно, данные должны быть изменены с sub:[{"":"", ...}] на sub:{"":"", ...}? Что вы хотите использовать в качестве rowid? student_name? Затем добавьте id: "head.student_name" к определению jsonReader или добавьте свойство key: true к определению столбца student_name. Или вы забыли включить его в данные JSON?

И последнее предложение. Если вы откроете http://trirand.com/blog/jqgrid/jqgrid.html и откроете в левой части дерева ветку «Отображение данных» \ «Оптимизация данных», вы увидите пример, где в JSON используется только массив вместо именованных элементов. Такие данные будут иметь минимальный размер и могут быстрее передаваться с сервера на клиент. Вместо этого у вас есть некоторые поля (например, " course_description "), которые вы вообще не используете. Поэтому , если вы можете внести какие-либо изменения в код сервера , попробуйте оптимизировать скорость передачи данных.

...