Может ли сетка jqgrid показывать пользовательский значок

Это первое изображение является результатом использования сетки дерева jqGrid. Значок установлен по умолчанию, элемент не из листьев начинается с "Перевернутый треугольник", элемент из листьев начинается с "o".

Как я могу настроить отображение так, как на втором изображении, я могу установить разные иконки для каждой строки?

1 ответ

Решение

Входные данные TreeGrid могут содержать icon свойство с именем класса, в котором указывается значок листа дерева. Значение свойств узла должно содержать два класса: один для расширенного узла и еще один для свернутого узла. Например

[
    { ...
        level: "0", parent: "null", isLeaf: false, expanded: true, loaded: true,
        icon: "ui-icon-folder-open,ui-icon-folder-collapsed" },
    { ...
        level: "1", parent: "1", isLeaf: true, expanded: false, loaded: true,
        icon: "ui-icon-flag" },
    { ...
        level: "2", parent: "2", isLeaf: true, expanded: false, loaded: true,
        icon: "ui-icon-star" },
    ...
]

Демо https://jsfiddle.net/OlegKi/4svafpub/3/ демонстрирует TreeGrid, который отображает

Вы не опубликовали какие-либо подробности, что вы делаете. Нет версии jqGrid, которую вы используете, нет информации о форке jqGrid ( бесплатная jqGrid, коммерческая версия Guriddo jqGrid JS или старая версия jqGrid в версии <=4.7). Неизвестно, какой CSS-фреймворк вы используете: jQuery UI или Bootstrap и какой набор значков (jQuery UI-иконки, Font Awesome 4.x, глиф-иконки Bootstrap ...). Точная реализация ваших требований будет зависеть от информации. В любом случае вам придется выбирать классы значков из набора значков, который вы используете, или вам нужно будет определить пользовательские классы CSS, которые вы будете использовать для узлов и листьев TreeGrid, а также определить правила CSS, которые определяют все необходимые Свойства CSS: background-image, background-position и так далее. В результате вы сможете отобразить любой значок, который вам нужен.

ОБНОВЛЕНО: Мне кажется, что icon будет использоваться только для листьев, а не для узлов, как описано выше.

ОБНОВЛЕНО 2: Я сделал некоторые изменения в коде бесплатной jqGrid, и теперь можно указать значки для узлов TreeGrid. Тот же код с обновленной версией бесплатных дисплеев jqGrid

Смотрите демо https://jsfiddle.net/OlegKi/4svafpub/4/

Другие вопросы по тегам