jqgrid форматирование сложного объекта - PullRequest
Новая
       12

jqgrid форматирование сложного объекта

1 голос
/ 06 июля 2011

У меня есть функция в коде моего сервера, которая возвращает список ElementRow объектов: 

public class ElementRow {
    public string AreaName { get; set; }
    public YearData CurrentYear { get; set; }
    public YearData PreviousYear { get; set; }
}

public class YearData {
    public int Value1 { get; set; }
    public int Value2 { get; set; }
}

Эти классы генерируют json, подобный этому: 

{"d":
    {
        "Total":2,
    "Page":1,
    "Records":30,
    "Rows":[
        {"AreaID":0,"CurrentYear":{"Value1":1,"Value2":2},"PreviousYear":{"Value1":1,"Value2":2}},
        {"AreaID":1,"CurrentYear":{"Value1":5,"Value2":4},"PreviousYear":{"Value1":1,"Value2":2}},
        {"AreaID":2,"CurrentYear":{"Value1":2,"Value2":1},"PreviousYear":{"Value1":1,"Value2":2}},
        {"AreaID":3,"CurrentYear":{"Value1":1,"Value2":3},"PreviousYear":{"Value1":1,"Value2":2}}
    ],
    "UserData":null
    }
}

У меня естьопределил colModel для поддержки этой структуры данных и хотел бы создать пользовательскую функцию форматирования для форматирования объекта типа YearData в одном столбце.Мой colModel выглядит следующим образом: 

$("#dashboard").jqGrid({
    url: wsBaseUrl + 'MyWebService.asmx/MyMethod',
    colNames: ['Area Name','Current Year', 'Previous Year'],
    colModel: [
        { name: 'AreaName', index: 'AreaName', width: 120, template: colTextTemplate },
        { name: 'CurrentYear', index: 'CurrentYear', width: 100, align: 'center', sortable: false, formatter: YearDataFormatter },
        { name: 'PreviousYear', index: 'PreviousYear', width: 100, align: 'center', sortable: false, formatter: YearDataFormatter }
    ],
    jsonReader: {
        id: "AreaID"
    },
    pager: $('#dashboard_pager'),
    sortname: 'AreaName',
    sortorder: "asc",
    height: '250',
    rownumbers: false,
    gridview: false,
    subGrid: true,

    //subgrid definition omitted
});

и затем определяет функцию YearDataFormatter следующим образом: 

function YearDataFormatter(cellvalue, options, rowObject) {
    var table = "<table><tr>";
    table += "<td>" + cellvalue.Value1 + "</td>";
    table += "<td>" + cellvalue.Value2 + "</td>";
    table += "</tr></table>";
    return table;
};

В любом случае, когда я пытаюсь выполнить эту функцию, проблема заключается в том, что внутри YearDataFormatter function значение параметра cellvalue не определено, а если посмотреть на него с помощью отладчика, в параметре rowObject есть допустимое значение.

Как правильно получить доступ к значению этой ячейки?

Кроме того, есть ли возможность изменить заголовок для определенного столбца?Я хотел бы создать двухстрочный заголовок, но если я добавлю разметку внутри опции colNames, высота заголовка не изменится соответственно.

Спасибо за вашу поддержку!

1 Ответ

3 голосов
/ 06 июля 2011

Вы не разместили данные JSON или XML, которые используются для заполнения сетки и определения jqGrid.Локальные данные или в случае использования loadone:true внутренние данные будут сохранены и все будет работать по-другому.Поэтому пользовательский форматер должен использоваться в зависимости от настроек.

Поскольку у меня недостаточно информации, я пытаюсь угадать.Я полагаю, что вы должны использовать 

function YearDataFormatter(cellvalue, options, rowObject) {
    var table = "<table><tr>",
        cellData = rowObject.CurrentYear; // or like rowObject[2]
    table += "<td>" + cellData.Value1 + "</td>";
    table += "<td>" + cellData.Value2 + "</td>";
    table += "</tr></table>";
    return table;
};

. Лучше всего было бы изменить формат данных, которые сервер использует для date, и использовать формат даты ISO 8601.Если вы используете .NET, вы можете использовать «o» или «O» форматер из DateTime.В этом случае вы можете использовать formatter:'date' или formatter:'date', formatoptions:{srcformat:'ISO8601Long'}.

ОБНОВЛЕНО : я уверен, что вы используете гораздо больше настроек по умолчанию в определении jqGrid.Без дополнительных настроек вы не сможете прочитать данные JSON.После небольшой модификации демо считывает данные, и я не вижу проблем с используемым вами пользовательским форматером: см. здесь :

enter image description here

Вы можетеСравните демо с молодежью, чтобы увидеть различия.

О вашем втором вопросе (многострочные данные в заголовке таблицы). Я рекомендую вам посмотреть здесь :

...