• jqGrid冻结列


    jqgrid冻结列

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

      做法:

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

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

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

      1     function gridList() {
      2         var $gridList = $("#gridList");
      3         $gridList.dataGrid({
      4             url: "/POM/Order/GetModels?plandate=" + $("#txt_plandate").val(),
      5             height: $(window).height() - 128,
      6             colModel: [
      7                 { label: '主键', name: 'Id', hidden: true, frozen: true },//这里
      8                 { label: '订单号', name: 'OrderCode',  130, align: 'left', frozen: true },//这里
      9                 {
     10                     label: '计划日', name: 'PlanDate',  80, align: 'left',
     11                     formatter: function (cellvalue) {
     12                         var oldTime = (new Date(cellvalue)).getTime();
     13                         var curTime = new Date(oldTime).format("yyyy-MM-dd");
     14                         return curTime;
     15                     }, frozen: true
     16                 },//这里
     17                 { label: '产品编号', name: 'MaterielNo',  70, align: 'left' },
     18                 { label: '产品名称', name: 'MaterielName',  70, align: 'left' },
     19                 { label: '产品型号', name: 'MaterielModel',  70, align: 'left' },
     20                 { label: '工艺', name: 'PPRName',  60, align: 'left' },
     21                 { label: '工艺', name: 'PPRCode', hidden: true },
     22                 { label: '生产线', name: 'CellName',  70, align: 'left' },
     23                 { label: '生产线', name: 'CellCode', hidden: true },
     24                 { label: '状态', name: 'StatusNameCN',  60, align: 'left' },
     25                 { label: '状态', name: 'Status', hidden: true },
     26                 { label: '类型', name: 'TypeNameCN',  60, align: 'left' },
     27                 { label: '类型', name: 'Type', hidden: true },
     28                 { label: '数量', name: 'Amount',  60, align: 'left' },
     29                 { label: '完成数量', name: 'FinishAmount',  60, align: 'left' },
     30                 { label: '单位', name: 'Uom',  60, align: 'left' },
     31                 { label: '前缀', name: 'Column_1',  100, align: 'left' },
     32                 { label: '号段开始', name: 'NumberSegmentStart',  60, align: 'left' },
     33                 { label: '排序号', name: 'OrderIndex',  60, align: 'left' },
     36                 { label: '实际开始时间', name: 'ActualStartTime',  80, align: 'left'},
     44                 { label: '实际结束时间', name: 'ActualEndTime',  80, align: 'left'},
     52                 { label: '备注', name: 'Memo',  80, align: 'left' }
     53             ],
     54             pager: "#gridPager",
     55             sortname: 'CreationTime desc',
     56             viewrecords: true,
     57           184         });
    185         jQuery("#gridList").jqGrid('setFrozenColumns');//这里
    186         $("#btn_search").click(function () {
    187             $gridList.jqGrid('setGridParam', {
    188                 url:"/POM/Order/GetModels",
    189                 postData: { plandate: $("#txt_plandate").val(),plandate2: $("#txt_plandate2").val() ,materielno: $("#txt_materielno").val(), type: $("#txt_type").val(), status: $("#txt_status").val() }
    190             }).trigger('reloadGrid');
    191         });
    193     }
  • 相关阅读:
    Failed to create the Java Virtual Machine
    图文解析进程与线程区别
    HTTP协议详解
    打开某网站无法访问出现空白页可能的原因
    子网划分举例
    上传验证绕过全解析
    Linux命令之远程登录与执行远程主机命令
    information_schema Introduction
    python多进程之multiprocessing
    python多线程之Threading
  • 原文地址:https://www.cnblogs.com/luna-hehe/p/7428594.html
Copyright © 2020-2023  润新知