jqgrid树网格可以显示用户定义的图标吗 [英] Can jqgrid tree grid show user-defined icon

问题描述

此第一张图片是使用jqGrid树形网格生成的.图标是默认设置，非叶子项目以倒三角"开头，叶子项目以"o"开头.

This first picture is result by using jqGrid tree grid. The icon is default set, non Leaf item is start with "Inverted triangle", Leaf item is start with "o".

如何设置使显示效果像第二张图片一样，我可以为每行设置不同的图标?

How can I set to make the display result like the second picture,I can set different icon for each row?

推荐答案

TreeGrid的输入数据可以包含带有类名称的icon属性，该属性指定了树叶的图标.节点属性的值应包含两个类:一个用于扩展节点，另一个用于折叠节点.例如

The input data of the TreeGrid can contain icon property with the class name, which specify the icon of the tree leaf. The value of node properties should contain two classes: one for expanded node and one more for collapsed node. For example

[
    { ...
        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

The demo https://jsfiddle.net/OlegKi/4svafpub/3/ demonstrates the TreeGrid, which displays

您没有发布任何详细信息.没有使用的jqGrid版本，没有有关jqGrid分支的信息(免费jqGrid ，商业 Guriddo jqGrid JS 或版本< = 4.7的旧jqGrid).使用哪个CSS框架是未知的:jQuery UI或Bootstrap以及哪个图标集(jQuery UI图标，Awesome Font 4.x，Bootstrap的字形图标...).您的要求的确切实施将取决于信息.无论如何，您都必须从使用的图标集中选择图标类，或者需要定义自定义CSS类(用于TreeGrid节点和叶子)以及定义CSS规则(指定所有必需的CSS规则) CSS属性:background-image，background-position等.结果，您将能够显示所需的任何图标.

You don't posted any details what you do. No version of jqGrid, which you use, no information about the fork of jqGrid (free jqGrid, commercial Guriddo jqGrid JS or an old jqGrid in version <=4.7). It's unknown which CSS framework you use: jQuery UI or Bootstrap and which icon set (jQuery UI icons, Font Awesome 4.x, glyph icons of Bootstrap ...). The exact implementation of your requirements will depends on the information. In any way you will have to choose the icons classes from the set of icons, which you use or you will need to define custom CSS classes, which you will use for TreeGrid nodes and leafs, and to define CSS rules, which specify all required CSS properties: background-image, background-position and so on. As the result you will be able to display any icon which you need.

更新:在我看来，icon仅用于叶子，而不用于如上所述的节点.

UPDATED: It seems to me that icon will be used only for leafs, not for nodes as it is described above.

更新2:我对免费jqGrid的代码进行了一些更改，现在可以为TreeGrid的节点指定图标.与免费jqGrid显示的更新版本相同的代码

UPDATED 2: I made some changes in the code of free jqGrid and now one can specify the icons for the nodes of TreeGrid. The same code with updated version of free jqGrid displays

请参阅演示 https://jsfiddle.net/OlegKi/4svafpub/4/

这篇关于jqgrid树网格可以显示用户定义的图标吗的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！