如图:
上网查了miniUI的有关资料,想要将它们合并居中,达到以下的效果。
具体做法:
在表的头那一项加align="center"
,可以使其居中。
此处的grid是你的datagrid的id;
定义一个变量数组,里面是你需要合并的单元格,其中包含4个属性,rowIndex,columnIndex分别代表行和列索引,均是从0开始算,rowSpan和colSpan分别代表要合并的行和列的宽度。
(3)最后需要调用mergeCells()方法来进行单元格合并,(2)中只是指出哪些单元格需要按照什么要求进行合并,真正的合并是步骤(3)。
最终达到效果:
记录下来,仅供学习,谢谢各位大佬的指点。
附:日期的控件
miniUI数据渲染:
<div id="datagridMiniFit" class="mini-fit">
<div id="markWeightEquipmentDatagrid" class="mini-datagrid" onLoad="load" style="width:100%;height:100%;" allowResize="true" ondrawgroup="onDrawGroup"
url="markWeightEquipment.do?method=markWeightEquipmentList" idField="ID" multiSelect="true" showPager="false">
<div property="columns">
<div field="DTL_NM" name="DTL_NM" width="70" headerAlign="center" align="center" allowSort="false" renderer="onActionRenderer">大项</div>
<div field="MARKS" name="MARKS" width="70" headerAlign="center" align="center" allowSort="false" renderer="onRenderer" >分数</div>
<div field="DETAILED" name="DETAILED" width="100px" headerAlign="center" allowSort="false">明细项</div>
<div field="PLUS" name="PLUS" width="70" headerAlign="center" allowSort="false" renderer="onActionRendererPlus">加分</div>
<div field="REDUCE" name="REDUCE" width="70" headerAlign="center" allowSort="false" renderer="onActionRendererReduce">减分</div>
</div>
</div>
</div>
function onActionRenderer(e){
var grid = e.sender;
var record = e.record;
var uid = record._uid;
var rowData = grid.getRowByUID(uid);
/* var s = rowData.DTL_NM;
return s; */
if(rowData.CD==11){
var s = rowData.DTL_NM;
return s;
}if(rowData.CD==31){
var s = rowData.DTL_NM;
return s;
}if(rowData.CD==41){
var s = rowData.DTL_NM;
return s;
}if(rowData.CD==51){
var s = rowData.DTL_NM;
return s;
}if(rowData.DTL_NM=="合计"){
var s = rowData.DTL_NM;
return s;
};
}
function onRenderer(e){
var grid = e.sender;
var record = e.record;
var uid = record._uid;
var rowData = grid.getRowByUID(uid);
if(rowData.CD==11){
var s = rowData.MARKS;
return s;
}if(rowData.CD==31){
var s = rowData.MARKS;
return s;
}if(rowData.CD==41){
var s = rowData.MARKS;
return s;
}if(rowData.DTL_NM=="合计"){
var s = rowData.MARKS;
return s;
};
}
function onActionRendererPlus(e) {
var grid = e.sender;
var record = e.record;
var uid = record._uid;
var rowData = grid.getRowByUID(uid);
if(rowData.PLUS == "" && rowData.DETAILED!=""){
var s = "";
return s;
}else if(rowData.DETAILED==""){
var s = rowData.PLUS;
return s;
}else{
var s = rowData.PLUS+" "+'<a href="javascript:editRow(\'' + uid + '\')">修改</a>';
return s;
};
}
function onActionRendererReduce(e) {
var grid = e.sender;
var record = e.record;
var uid = record._uid;
var rowData = grid.getRowByUID(uid);
if(rowData.REDUCE == "" && rowData.DETAILED!=""){
var s = "";
return s;
}else if(rowData.DETAILED==""){
e.rowStyle = 'background-color:#FFC125';
var s = rowData.REDUCE;
return s;
}else{
var s = rowData.REDUCE+" "+'<a href="javascript:editRow(\'' + uid + '\')">修改</a>';
return s;
};
}
function editRow(row_uid) {
var row = grid.getRowByUID(row_uid);
//alert(row.CLASSIF);
if (row) {
editWindow.show();
var form = new mini.Form("#editform");
form.clear();
//form.loading();
$.ajax({
url: "markWeightEquipment.do?method=markWeightEquipmentGet&CD="+row.CD,
success: function (text) {
form.unmask();
var t = eval('('+text+')');
//alert(t.REDUCE);
if(t.PLUS != ""){
t["VAL1"]=t.PLUS;
$("#stringText").show();
} else{
t["VAL1"]=t.REDUCE;
$("#stringText").show();
}
// console.log(t);
form.setData(t);
},
error: function () {
alert("表单加载错误");
form.unmask();
}
});
};
}