JqGird 动态生成列使用

使用场景：

在工作用需要自定义动态生成列，通过选择下拉框，加载列，通过查询加载列对应的数据信息

当选择文件源任务显示三列

当选择数据源任务显示两列

处理方式：

1. 首先在刚进入界面时初始化控件

  $("#pageGrid").jqGrid({
        //url: 'DataGatherShow.ashx',
        sortable: true,
        datatype: "local",
        autowidth: true,
        mtype: 'POST',
        height: "100%",
        rownumbers: true,
        pager: "#pager1",
        rowNum: 10,
        rowList: [10, 20, 30],
        viewrecords: true,
        onSelectRow: function (rowid) {
            menuPurFn.puerID = rowid;
        },
    });

选择项的时候，再次初始化框架,初始化前必须卸载才能重绘

卸载方法调用：

$("#pageGrid").GridUnload();

重绘方法调用：列和列信息进行设置，datatype:json 一定要加上 jsonReader 中的数据，否则数据加载不出来

         重新加载jqGrid
        $("#pageGrid").jqGrid({
            //url: 'DataGatherShow.ashx',
            sortable: true,
            datatype: 'json',
            autowidth: true,
            mtype: 'POST',
            height: gridHeight,
            rownumbers: false,
            colNames: columnnames,
            colModel: columnobjs,
            pager: "#pager1",
            rowNum: 10,
            rowList: [10, 20, 30],
            viewrecords: true,         
            onSelectRow: function (rowid) {
                menuPurFn.puerID = rowid;
            },
            jsonReader: {
                repeatitems: false
            }
        });

1. 点击查询的时候，通过后台请求数据，

  $("#pageGrid").jqGrid('setGridParam', {
            url: "DataGatherShow.ashx",
            postData:
                {
                    ActionType: "list",
                    tablename: tablename,
                    columnnames: columns,
                    stime: stime,
                    etime: etime,
                    seniorCondition: seniorConditionJson
                }, //发送数据
            page: 1
        }).trigger("reloadGrid"); //重新载入 

原文地址：https://blog.csdn.net/xunbaogang/article/details/143488603

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！