jqGrid colModel 绑定数据中显示图片字段的方法-木庄网络博客

2020-01-14 15:54:15 木庄网络博客 JavaScript

jqGrid colModel 绑定数据中显示图片字段的方法：

$("#jqGrid").jqGrid({
        url: '请求数据的接口',
        datatype: "json",
        mtype: "POST",
        colModel: [
            {label: '', name: 'id', width: 50},
            {label: '创建时间', name: 'createTime', width: 50},
            {
                //列表中显示图片
                label: '图片', name: 'picUrl', width: 50, formatter: function (cellvalue) {
                    return '<img src="' + cellvalue + '" style="width: 100%;height: 100%" />';
                }
            }
        ],
        viewrecords: true,
        height: 385,
        rowNum: 10,
        rowList: [10, 30, 50],
        rownumbers: true,
        rownumWidth: 25,
        autowidth: true,
        multiselect: true,
        pager: "#jqGridPager",
        jsonReader: {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames: {
            page: "page",
            rows: "limit",
            order: "order"
        },
        gridComplete: function () {
            //隐藏grid底部滚动条
            $("#jqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
            vm.GetAdPlace();
        }
    });