JSGrid 根据 true 或 false 值添加图标而不是文本

Question

我正在尝试根据 JSGrid 中的值是真还是假来添加图标（锁）。

我有一个名为 SoftLock 的变量，如果这是真的，我想在网格上插入一个锁图标。

我有以下字段，但不确定如何继续：

var fields = [
                        { name: 'ID', type: 'text', visible: false },
//THIS FIELD BELOW
                        { name: 'SoftLock', type: 'text', title: 'Locked', formatter : function () {return "<span class='fa fa-lock'><i class='fa fa-lock' aria-hidden='true'></i></span>"} },
//THIS FIELD ABOVE
                        { name: 'Status', type: 'select', items: MatterStatusEnum.List, valueField: 'Id', textField: 'Name', width: 70, title: 'Account Status' },
                        { name: 'AttorneyRef', type: 'text', title: 'Reference' },
                        { name: 'Investors', type: 'text', title: 'Investor/s' },
                        { name: 'AccountNumber', type: 'text', width: 70, title: 'Account Number' },
                        { name: 'IntermediaryName', type: 'text', title: 'Intermediary Name' },
                        { name: 'CreatedBy', type: 'text', title: 'Captured By' },
                        { name: 'RequestedDate', type: 'date', title: 'Requested Date'}
                ];

我用过格式化程序，但没有成功。另外，如果为真，如何显示图标，如果为假，则什么都不显示。

如有任何帮助，我们将不胜感激。

Answer 1

我使用 itemTemplate 解决了这个问题，如下所示：

{ 
name: 'SoftLock', type: 'text', title: 'Locked', width: 30, 
itemTemplate : function (value, item) {
    var iconClass = "";
    if (value == true) {
        iconClass = "fa fa-lock"; //this is my class with an icon
    } 
    return $("<span>").attr("class", iconClass);
}

就这么简单:)

Answer 2

很久以后，但试试下面的方法

{ 
    type: "control", 
    editButton: true
}

此外，正式文档中对答案进行了更好的描述。

http://js-grid.com/docs/#control

JSGrid 根据 true 或 false 值添加图标而不是文本

JSGrid add icon instead of text based on true or false value

javascript

grid

jsgrid