Как добавить класс css в определенные строки в slickGrid?

Я искал всюду, чтобы узнать, как добавить класс в определенную строку в slickgrid. Похоже, что раньше было свойство rowCssClasses, но теперь оно исчезло. Любая помощь в этом была бы чрезвычайно оценена.

Обновить. Я понял это с помощью getItemMetadata... поэтому перед рендерингом вам нужно сделать что-то вроде этого:

dataView.getItemMetadata = function (row) {
    if (this.getItem(row).compareThis > 1) {
        return {
            'cssClasses': 'row-class'
        };
    }
};

Это добавит класс row в класс, соответствующий запросу if. Кажется, что эта функция getItemMetadata не существует, пока вы ее не поместили, и slickGrid проверяет, есть ли там что-нибудь. Из-за этого сложно определить его варианты, но если вы ищете getItemMetadata в файле slick.grid.js, вы должны найти скрытые сокровища! Надеюсь, это поможет кому-то!

Если есть лучший способ сделать это, пожалуйста, дайте мне знать.

Ответы

Ответ 1

В новых версиях SlickGrid DataView предоставляет собственную getItemMetadata для форматирования заголовков и итогов групп. Однако это легко осуществить с вашей собственной реализацией. Например,

function row_metadata(old_metadata_provider) {
  return function(row) {
    var item = this.getItem(row),
        ret = old_metadata_provider(row);

    if (item && item._dirty) {
      ret = ret || {};
      ret.cssClasses = (ret.cssClasses || '') + ' dirty';
    }

    return ret;
  };
}

dataView.getItemMetadata = row_metadata(dataView.getItemMetadata);

Ответ 2

        myDataView.getItemMetadata = function(index)
        {
            var item = myDataView.getItem(index);
            if(item.isParent === true) {
                return { cssClasses: 'parentRow' };
            }
            else {
                return { cssClasses: 'childRow' };
            }
        };

//В моем CSS

       .parentRow {
           background-color:  #eeeeee;
        }
        .childRow {
           background-color:  #ffffff;
        }

Ответ 3

Вы можете использовать функцию setCellCssStyles: https://github.com/mleibman/SlickGrid/wiki/Slick.Grid#wiki-setCellCssStyles

grid.setCellCssStyles(key, hash)

key - Строковый ключ. Перепишет любые данные, уже связанные с этот ключ.

hash - хэш дополнительных классов CSS ячейки, набранных номером строки и затем по столбцу id. Несколько классов CSS могут быть указаны и разделены по пространству.

Пример:

{ 0: { "number_column": "cell-bold", "title_column": "cell-title cell-highlight" }, 4: { "percent_column": "cell-highlight" }}

Я использовал это, чтобы выделить отредактированные поля в моей сетке. Мне не понравился метод getItemMetadata.