现在的位置: 首页 > 综合 > 正文

datagrid的合并单元格(合并行、并列)

2014年08月29日 ⁄ 综合 ⁄ 共 2488字 ⁄ 字号 评论关闭

并列很简单:

columns:[[
        {field:'examId',title:'批次',width:150,align:'center',rowspan:2,
        //添加超级链 
        formatter:function(value,rowData,rowIndex){
            //function里面的三个参数代表当前字段值,当前行数据对象,行号(行号从0开始)
            //alert(rowData.typeCode);通过这个可以得到所有字段的数据,如typeCOde,teacherId等  
            return "<a href='javascript:editit("+value+")' style='color:blue;'>"+value+"</a>";
        }
        },
        {field:'name',title:'考试名称',width:150,align:'center',rowspan:2},
        {field:'studentNum',title:'批次人数',width:100,align:'center',rowspan:2},
        {field:'examTime',title:'开考时间',width:150,align:'center',rowspan:2,
        formatter:function(val,rec){
//调用时间格式转换方法
return formattime(val);
  }
        },
        {field:'planStatus',title:'考试状态',width:150,align:'center',styler:cellStyler,rowspan:2,
        formatter:function(value,rowData,rowIndex){
              //function里面的三个参数代表当前字段值,当前行数据对象,行号(行号从0开始)
              //alert(rowData.username);
              var str = "";
              if(value=="1"){
             
str = "当前考试";
              }else{
             
str = "考试已关闭";
              }
              return "<div>"+str+"</div>";
         }
        },
        {title:'操作',colspan:2}
 
 ],[
       {field:'开放考试',title:'开放考试',width:150,align:'center',
       
//添加超级链 
          formatter:function(value,rowData,rowIndex){
              //function里面的三个参数代表当前字段值,当前行数据对象,行号(行号从0开始)
              //alert(rowData.username);
              var str = "";
              if(rowData.planStatus=="1"){
             
str = "当前考试";
             
return "<div style='color:blue;'>"+str+"</div>";
              }else{
             
str = "开放考试";
             
return "<a href='#' style='color:blue;' onclick='openPlan("+rowData.examId+")'>"+str+"</a>";
              }
         }
       },
       {field:'关闭考试',title:'关闭考试',width:150,align:'center',
       
//添加超级链 
          formatter:function(value,rowData,rowIndex){
              var str = "";
              if(rowData.planStatus=="0"){
             
str = "考试已关闭";
             
return "<div style='color:blue;'>"+str+"</div>";
              }else{
             
str = "关闭考试";
             
return "<a href='#' style='color:blue;' onclick='closePlan("+rowData.examId+")'>"+str+"</a>";
              }
         }
       }
   ]]



合并行稍微有点难度:

onLoadSuccess: function (data) {
             
var rows = $('#tt2').datagrid('getRows');
for(var i=0;i<rows.length;i++){
$('#tt2').datagrid('beginEdit', i);
}//使每行可编辑状态
merge();//调用合并行方法
            },

 onAfterEdit: function (rowIndex, rowData, changes) {
           var rows = $('#tt2').datagrid('getRows');
for(var i=0;i<rows.length;i++){
$("#tt2").datagrid('endEdit',i);
}
merge();//每次完成编辑后,调用合并,否则会每行出现

           editRow = undefined;
       },



//合并行方法
function merge(){
var len = $("#tt2").datagrid("getRows").length;
$("#tt2").datagrid('mergeCells',{
index: 0,//开始合并的行
field: 'OPERATION',//列属性
rowspan: len//合并的行数
});
}


如果有多行需要合并,则可以定义一个变量存储需要合并的属性和系列号index

抱歉!评论已关闭.