代码改变世界

jqgrid合并单元格

2017-05-17 16:59  sihao560  阅读(6004)  评论(0编辑  收藏  举报

jqgrid合并单元格

 

  1 $(grid_selector).jqGrid({
  2         url: "${ctx!}/order/info/queryOrderList",
  3         datatype: "json",
  4         mtype: "post",
  5         postData:$("#order_search_form").serializeObject(),
  6         caption: "aa",
  7         autowidth: true,
  8         height: "100%",
  9         colModel: [
 10             { label: "id", name: "id", width: 90, hidden:true },//子订单id
 11             { label: "mid", name: "mid", width: 90, hidden:true },//主订单id
 12             {label: "操作",name: "", width: 75, fixed:true, sortable:false, resize:false,
 13                     formatter:'actions', 
 14                     formatoptions:{ 
 15                         keys:true
 16                         ,delOptions:{
 17                             recreateForm: true,//创建表单 
 18                             beforeShowForm: BLN_jqGrid.style_delete_form//在每次点击编辑的时候都会执行。
 19                         } 
 20                      }
 21             },
 22             { label: "航站", name: "value",sortable:false, width: 50,align:'center'},
 23             { label: '主订单',name: "main_no", index: 'total', width: 60,align:'center',
 24                 sortable: false, formatter: viewMainOrder,
 25                 cellattr: function(rowId, value, rowObject, colModel, arrData) {
 26                     return 'id=\'main_no' + rowId + "\'";//①给当前想合并的单元格设置id
 27                 }
 28             },
 29             { label: '子订单',  width: 60,align:'center',
 30                 sortable: false, formatter: viewSubOrder,
 31             },
 32             { label: '货物图片',  width: 60,align:'center',
 33                 sortable: false, formatter: viewSubFile,
 34             },
 35             { label: "操作人", name: "user_name",sortable:false, width: 30,align:'center'},
 36             { label: "上传时间", name: "create_time",sortable:false, width: 60,align:'center'},
 37             { label: "修改时间", name: "modify_time",sortable:false, width: 60,align:'center'}
 38         ],
 39         viewrecords: true,
 40         rowNum: 10,
 41         rowList:[10,20,30,40],
 42         rownumbers: true,
 43         altRows: true,
 44         multiselect: true,
 45         multiboxonly: false,
 46         pager:pager_selector,
 47         loadComplete : function(data) {
 48             if(SQ.isFAIL(data)){
 49                 bootbox.alert(SQ.getMessage(data));
 50                 return;
 51             }
 52             var table = this;
 53             setTimeout(function(){
 54                 BLN_jqGrid.styleCheckbox(table);//复选框风格
 55                 BLN_jqGrid.updateActionIcons(table);//更新操作图标
 56                 BLN_jqGrid.updatePagerIcons(table);//更新页面图标
 57                 BLN_jqGrid.enableTooltips(table);//启用工具提示
 58                 
 59                 setTimeout(function(){$(window).triggerHandler('resize.jqGrid');},0);//触发窗口调整网格得到正确的大小
 60                 $(grid_selector+" [id^='jEditButton_']").removeAttr("onclick");
 61                 $(grid_selector+" [id^='jEditButton_']").on('click', function(){
 62                     var index = $(this).attr("id").substr("jEditButton_".length);
 63                     var rd = $(grid_selector).getRowData(index);
 64                     editOrderInfoBef(rd);
 65                 });
 66                 $(grid_selector+" [id^='jDeleteButton_']").removeAttr("onclick");
 67                 $(grid_selector+" [id^='jDeleteButton_']").on('click', function(){
 68                     var index = $(this).attr("id").substr("jDeleteButton_".length);
 69                     var rd = $(grid_selector).getRowData(index);
 70                     deleteOrderInfoBef(rd);
 71                 });
 72             }, 0);
 73             
 74             //合并单元格
 75             var gridName = "order_grid";
 76             Merger(gridName, 'main_no');
 77         }
 78     });
 79     //公共调用方法
 80     function Merger(gridName, CellName) {
 81         //得到显示到界面的id集合
 82         var mya = $("#" + gridName + "").getDataIDs();
 83         //console.log(mya);
 84         //当前显示多少条
 85         var length = mya.length;
 86         for (var i = 0; i < length; i++) {
 87             //从上到下获取一条信息
 88             var before = $("#" + gridName + "").jqGrid('getRowData', mya[i]);
 89             //定义合并行数
 90             var rowSpanTaxCount = 1;
 91             for (j = i + 1; j <= length; j++) {
 92                 //和上边的信息对比 如果值一样就合并行数+1 然后设置rowspan 让当前单元格隐藏
 93                 var end = $("#" + gridName + "").jqGrid('getRowData', mya[j]);
 94                 if (before[CellName] == end[CellName]) {
 95                     rowSpanTaxCount++;
 96                     $("#" + gridName + "").setCell(mya[j], CellName, '', { display: 'none' });
 97                 } else {
 98                     rowSpanTaxCount = 1;
 99                     break;
100                 }
101                 $("#" + CellName + "" + mya[i] + "").attr("rowspan", rowSpanTaxCount);
102             }
103         }
104     }