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,
          184         });
        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');
        });
    }