Как сохранить N количество значений в заголовке столбца?

Question

У меня есть следующий jsfiddle для создания jqgrid в своде. jsfiddle code использует следующие данные json. Дата

var data = [{ 
    "id": 1, 
    "make": "toyota", 
    "model": "corolla", 
    "fuelusagecity": "17", 
    "fuelusagehwy": "12", 
    "fuelmeasure":'Litre', 
    "salesaboveavg": false, 
    "totalnumberofsales": 120000.0000, 
    "highsalestext": null, 
    "salesdate": "2010-12-01", 
    "shortsalesdate": "10-12-01", 
    "groupheaderorder":"1", 
    "childorder":"1" 
}, { 
    "id": 2, 
    "make": "toyota", 
    "model": "corolla", 
    "fuelusagecity": "10", 
    "fuelusagehwy": "14", 
    "salesaboveavg": false, 
    "fuelmeasure":'Litre', 
    "totalnumberofsales": 100000.0000, 
    "highsalestext": "HIGH", 
    "salesdate": "2010-12-15", 
    "shortsalesdate": "10-12-15", 
    "groupheaderorder":"1", 
    "childorder":"1" 
}, { 
    "id": 3, 
    "make": "toyota", 
    "model": "belta", 
    "fuelusagecity": "15", 
    "fuelusagehwy": "10", 
    "salesaboveavg": true, 
    "fuelmeasure":'Litre', 
    "totalnumberofsales": 200000.0000, 
    "highsalestext": null, 
    "salesdate": "2011-01-10", 
    "shortsalesdate": "11-01-10", 
    "groupheaderorder":"1", 
    "childorder":"2" 
}, { 
    "id": 4, 
    "make": "toyota", 
    "model": "camry", 
    "fuelusagecity": "13", 
    "fuelusagehwy": "10", 
    "fuelmeasure":'Litre', 
    "salesaboveavg": false, 
    "totalnumberofsales": 300000.0000, 
    "highsalestext": "HIGH", 
    "salesdate": "2011-04-23", 
    "shortsalesdate": "11-04-23", 
    "groupheaderorder":"1", 
    "childorder":"3" 
}, { 
    "id": 5, 
    "make": "nissan", 
    "model": "skyline", 
    "fuelusagecity": "14", 
    "fuelusagehwy": "9", 
    "fuelmeasure":'Litre', 
    "salesaboveavg": true, 
    "totalnumberofsales": 500000.0000, 
    "highsalestext": "HIGH", 
    "salesdate": "2010-09-10", 
    "shortsalesdate": "10-09-10", 
    "groupheaderorder":"2", 
    "childorder":"1" 
}, { 
    "id": 6, 
    "make": "nissan", 
    "model": "zx300", 
    "fuelusagecity": "10", 
    "fuelusagehwy": "8", 
    "fuelmeasure":'Litre', 
    "salesaboveavg": false, 
    "totalnumberofsales": 400000.0000, 
    "highsalestext": null, 
    "salesdate": "2012-01-06", 
    "shortsalesdate": "12-01-06", 
    "groupheaderorder":"2", 
    "childorder":"2" 
}]; 

в данных JSon, продаж поставляется в двух форматах salesdate собственности имеет год четыре цифр и shortsalesdate имеет год два цифр. В столбцах динамических дат таблицы сетки должна отображаться дата продажи в формате yy-mm-dd (поэтому для отображения следует использовать свойство shortsalesdate).

В скобках даты кодов были отсортированы в порядке убывания. новая модификация также должна сортировать даты в порядке декодирования. На этот раз он должен использовать дату продажи в свойстве salesdate для сортировки, но он должен отображать дату продажи, используя свойство shortsalesdate в заголовке столбца.

Во-вторых, есть две кнопки для отображения и скрытия столбцов. есть сравнение дат продаж по методу getYColumnName перед скрытием/показом. В текущем jsfiddle-коде используется значение в свойстве salesdate для сравнения. это должно быть сохранено, как есть.

Таким образом, есть в основном две вещи: 1. Для отображения даты продаж, он должен использовать значение в свойстве shortsalesdate 2. для всех дат сравнения и сортировки его необходимо использовать значение в свойстве salesdate

Как мне это достичь?

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

благодаря

Answer 1

Я мог бы предложить вам некоторые обходной путь, как вы могли бы реализовать свои потребности в текущей версии 4.13.6 свободного jqGrid, но я думаю, что решение вашей проблемы должно быть очень легко.

Что вы хотите сделать, это просто настроить текст, который будет отображаться в заголовке столбца. Таким образом, я внесла некоторые изменения в код бесплатного jqGrid (см. Здесь) и разместил результаты в GitHub.

The demo загружает последнюю версию кода из GitHub, и он использует

yDimension: [ 
    { dataName: "salesdate", sortorder: "desc", 
     label: function (options) { 
      // options has the following properties: 
      // yData, yIndex, yLevel, pivotOptions 
      var date = String(options.yData).split("-"); 
      return date[0].substr(2) + "-" + date[1] + "-" + date[2]; 
     }} 
] 

Новый label обратного вызова позволяет построить заголовок столбца на основе данных. Я разделил дату на -, вырезал первые два символа из года и создал новую строку. Один увидеть результаты, как на картинке ниже

Мой демо не использовать shortsalesdate собственность и использует только оригинальные salesdate.

Те же самые работы в случае использования нескольких элементов в yDimension.Демонстрационная https://jsfiddle.net/OlegKi/e1rvyczh/3/ использует

yDimension: [ 
    { dataName: "salesYear", sorttype: "integer", sortorder: "desc", 
     label: function (options) { 
      return "(" + options.yData + ")"; 
     }}, 
    { dataName: "salesdate", sortorder: "desc", 
     label: function (options) { 
      // options has the following properties: 
      // yData, yIndex, yLevel, pivotOptions 
      var date = String(options.yData).split("-"); 
      return date[0].substr(2) + "-" + date[1] + "-" + date[2]; 
     }} 
] 

с фиктивным форматированием за год: Я просто заключите его в фигурных скобках: ( и ) использование return "(" + options.yData + ")";. Результаты выглядят следующим образом

Очень важно, чтобы вы освежить свои источники свободной jqGrid от GitHub (от here)