如何在免费的 jqgrid 中使用 bootstrap 标准图标

Question

如何在 jqgrid 中使用 Twitter Bootstrap（Glyphicon Halflings 集）附带的图标？

jqgrid 允许使用 FontAwesome 图标，但此要求uires 包括附加文件。由于 bootstrap 已经包含图标 (http://getbootstrap.com/components/)，附加文件会导致重复并且不是必需的。

如何在 jqgrid 中使用默认 bootstrap 图标？

更新

我正在寻找一种方法来替换所有 FontAwesome 图标，以便添加 FontAwesome 和 jquery ui 图片图像不再需要 uired。

演示

http://www.ok-soft-gmbh.com/jqGrid/OK/navButtons2-fa4.htm

显示需要更换的基本图标。

顶部的新图标：

添加-glyphicon-plus
编辑 - 字形铅笔

等等

通常FontAwecome和Glyphicons同名。通讯table在

http://tagliala.github.io/vectoriconsroundup/

另一种可能是使用CSS创建图标。在这种情况下，根本不需要特殊的图标字体。

Answer 1

我在the wiki article中描述了如何创建custom iconSet

我准备了the demo which demonstrates creating of custom iconSet with mix icons: the part from Font Awesome and the part from Twitter Bootstrap (Glyphicon Halflings set)。它显示如下图所示的结果

其中添加、编辑和其他一些图标（但不是查看图标）来自 Glyphicon：

我使用以下代码将 fa class 的用法从顶部 common 属性移动到子位置。因为我需要在导航栏中使用混合图标。我在每个单独的图标定义中定义了空 nav.common 并移动了 fa class。到最重要的部分代码如下

$.extend(true, $.jgrid.icons, {
    glyphIcon: {
        //common: "",
        pager: {
            common: "fa fa-fw",
            first: "fa-step-backward",
            prev: "fa-backward",
            next: "fa-forward",
            last: "fa-step-forward"
        },
        ...
        nav: {
            common: "",
            edit: "glyphicon glyphicon-pencil",
            add: "glyphicon glyphicon-plus",
            del: "glyphicon glyphicon-trash",
            search: "glyphicon glyphicon-search",
            refresh: "glyphicon glyphicon-refresh",
            view: "fa fa-lg fa-fw fa-file-o",
            save: "glyphicon glyphicon-save",
            cancel: "glyphicon glyphicon-ban-circle",
            newbutton: "fa fa-lg fa-fw fa-external-link"
        },
        ...
    }
});

$grid.jqGrid({
    ...
    iconSet: "glyphIcon",
    ...
});

我建议您将图标集的定义 glyphIcon 与默认包含在免费 jqGrid 中的图标集 jQueryUI 和 fontAwesome 的定义进行比较（参见 the lines ).

如何在免费的 jqgrid 中使用 bootstrap 标准图标

How to use bootstrap standard icons in free jqgrid

jqgrid

twitter-bootstrap

twitter-bootstrap-3

free-jqgrid