2

我使用 gridComplete 来显示 HTML 按钮,但它显示 HTML 文本而不是按钮,并将 HTML 编码为标题,看起来不太好。请帮我删除或更改标题(工具提示)并显示按钮

输出

输出 -

当我检查这个单元格时,我可以在 chrome 工具中看到以下内容 -

<td role="gridcell" style="" title="&amp;lt;input type='button' value='Publish' onclick='publish(100)' /&amp;gt;" aria-describedby="list_actionBtn">&lt;input type='button' value='Publish' onclick='publish(100)' /&gt;</td>

jqgrid 代码

var myColModel = [ {
    name : "promoId",
    index : 'Promotionid',
    width : 60
}, {
    name : "promoCode",
    index : 'promotioncode',
    width : 110
}, {
    name : "name",
    index : 'name',
    width : 160
}, {
    name : "description",
    index : 'description',
    width : 250
}, {
    name : "distCode",
    index : 'distributor_code',
    width : 110
} , {
    name : "statusId",
    hidden : true
} , {
    name : "statusVal",
    index : 'status',
    width : 90
}, {
    name : "startDate",
    index : 'start_date',
    width : 100,
    sorttype : "date",
    align : "right"
}, {
    name : "endDate",
    index : 'end_date',
    width : 100,
    sorttype : "date",
    align : "right"
}, {
    name : "discount",
    index : 'discount',
    width : 80
}, {
    name : "extension",
    index : 'extension',
    width : 80
}, {
    name : "isDiscount",
    hidden : true
}, {
    name : "isExtension",
    hidden : true
}, {
    name : "actionBtn",
    width : 100
} ];
$(function() {
    $("#list")
            .jqGrid(
                    {
                        url : '/suiactcodegen/action/promotion/promolist',
                        datatype : "json",
                        mtype : "GET",
                        colNames : [ "Promo ID", "Promo Code", "Name",
                                "Description", "Distributor Code", "Stt Id",
                                "Status", "Start Date", "End Date",
                                "Discount", "Extension", "Is Disc", "isExtn", "" ],
                        colModel : myColModel,
                        pager : "#pager",
                        rowNum : 10,
                        rowList : [ 10, 20, 30 ],
                        sortname : "end_date",
                        sortorder : "asc",
                        viewrecords : true,
                        gridview : true,
                        rownumber : true,
                        autoencode : true,
                        width : '1000px',
                        height : 'auto',
                        caption : "Promotion Summary",
                        gridComplete: function() {
                            var ids = $("#list").jqGrid('getDataIDs');
                            for (var i = 0; i < ids.length; i++) {
                                var rowId = ids[i],
                                    statusId = $("#list").jqGrid ('getCell', rowId, 'statusId'),
                                    activeBtn = "";
                                    if (statusId == 0) { // Inactive
                                        activeBtn = "<input type='button' value='Publish' " +
                                           "onclick='publish(" + rowId + ")' />";
                                    }
                                    //else if (statusId == 1) { // Published
                                    //  activeBtn = "<input type='button' value='Expire' " +
                                    //       "onclick=\"expire(" + rowId + ");\" />";
                                    //} 
                                 $("#list").jqGrid('setRowData', rowId, { actionBtn: activeBtn });
                            }
                        } 
                        }).jqGrid('navGrid', '#pager', {
                add : false,
                edit : false,
                del : false,
                search : true,
                refresh : false
            }).jqGrid('navButtonAdd', '#pager', {
                caption : " Edit ",
                // buttonicon: "ui-icon-bookmark",
                onClickButton : editPromo,
                position : "last"
            });


});

-- 更新 -- 我已经为此列尝试了 autoencode = false 但它没有用

IMP 更新 我认为它不起作用的原因是因为数据类型是 'json' 但按钮类型不是 json 数据类型。如何将其创建为单独的行?如果是“本地”数据,它可以工作。请参阅小提琴http://jsfiddle.net/zpXCT/3/。甚至在我的本地主机中对其进行了测试

4

2 回答 2

3

抱歉,我从 JqGrid 站点复制了基本网格,然后对其进行了编辑,但没有注意到网格级别的 autoencode:true 。因此,即使我在列级别提到它,它也不起作用。现在它出现了。

于 2013-08-03T11:51:43.147 回答
1

设置 colmodel 数据类型 = 'html'

于 2013-10-01T10:33:02.707 回答