jqGrid冻结列

jqgrid冻结列

　　冻结列：就是横向移动表格时，让某一列保持不动

　　做法：

　　　　1.colModel的行要加上属性： frozen:true。注意：冻结列必须从第一列开始，包括隐藏列

　　　　2.加载jqgrid后需要再加上这句：$("#jq_table") .jqGrid('setFrozenColumns')

　　　  3.也可以加上shrinkToFit: false 属性 // ture: 按比例初始化列宽度  false: 列宽度使用colModel指定的宽度   ---这里设置为false是当数据为空也能看到冻结效果，可根据实际需求设置

     function gridList() {
         var $gridList = $("#gridList");
         $gridList.dataGrid({
             url: "/POM/Order/GetModels?plandate=" + $("#txt_plandate").val(),
             height: $(window).height() - 128,
             colModel: [
                 { label: '主键', name: 'Id', hidden: true, frozen: true },//这里
                 { label: '订单号', name: 'OrderCode', width: 130, align: 'left', frozen: true },//这里
                 {
                     label: '计划日', name: 'PlanDate', width: 80, align: 'left',
                     formatter: function (cellvalue) {
                         var oldTime = (new Date(cellvalue)).getTime();
                         var curTime = new Date(oldTime).format("yyyy-MM-dd");
                         return curTime;
                     }, frozen: true
                 },//这里
                 { label: '产品编号', name: 'MaterielNo', width: 70, align: 'left' },
                 { label: '产品名称', name: 'MaterielName', width: 70, align: 'left' },
                 { label: '产品型号', name: 'MaterielModel', width: 70, align: 'left' },
                 { label: '工艺', name: 'PPRName', width: 60, align: 'left' },
                 { label: '工艺', name: 'PPRCode', hidden: true },
                 { label: '生产线', name: 'CellName', width: 70, align: 'left' },
                 { label: '生产线', name: 'CellCode', hidden: true },
                 { label: '状态', name: 'StatusNameCN', width: 60, align: 'left' },
                 { label: '状态', name: 'Status', hidden: true },
                 { label: '类型', name: 'TypeNameCN', width: 60, align: 'left' },
                 { label: '类型', name: 'Type', hidden: true },
                 { label: '数量', name: 'Amount', width: 60, align: 'left' },
                 { label: '完成数量', name: 'FinishAmount', width: 60, align: 'left' },
                 { label: '单位', name: 'Uom', width: 60, align: 'left' },
                 { label: '前缀', name: 'Column_1', width: 100, align: 'left' },
                 { label: '号段开始', name: 'NumberSegmentStart', width: 60, align: 'left' },
                 { label: '排序号', name: 'OrderIndex', width: 60, align: 'left' },
                 { label: '实际开始时间', name: 'ActualStartTime', width: 80, align: 'left'},
                 { label: '实际结束时间', name: 'ActualEndTime', width: 80, align: 'left'},
                 { label: '备注', name: 'Memo', width: 80, align: 'left' }
             ],
             pager: "#gridPager",
             sortname: 'CreationTime desc',
             viewrecords: true,
                    });
         jQuery("#gridList").jqGrid('setFrozenColumns');//这里
         $("#btn_search").click(function () {
             $gridList.jqGrid('setGridParam', {
                 url:"/POM/Order/GetModels",
                 postData: { plandate: $("#txt_plandate").val(),plandate2: $("#txt_plandate2").val() ,materielno: $("#txt_materielno").val(), type: $("#txt_type").val(), status: $("#txt_status").val() }
             }).trigger('reloadGrid');
         });
     }