您的位置:首页 > 产品设计 > UI/UE

ligerUI实现grid同一列根据不同的值编辑时呈现不同类型的编辑器

2015-08-27 16:11 661 查看
遇到一个恶心的需求是ligerGrid点击列的时候根据另外一个列的值变成不同的输入框

有可能是文本框,也有可能是下拉框

function loadDataGridCopy(){
//初始化dataGrid
if (!dataGridCopy) {
dataGridCopy = $(".org-data").zoeGrid({
columns: [
{ display: '参数名', name: 'parameterName',width:"20%"},
{ display: '参数中文名', name: 'parameterChiName',width:"20%"},
{ display: '参数值', name: 'parameterValue',width:"20%"},
{ display: '分发类型', name: 'allotTypeName',width:"20%"},
{ display:'123',name:'allotType',hide:'hidden',width:0},
{ display: '分发代码', name: 'allotCode',width:"20%",
editor: { type:"text"}
}
],
height: 528,        //初如化设置表格高
headerRowHeight:36,
rownumbers:false,
frozenRownumbers:true,
checkbox:false,
usePager:false,
enabledEdit:true,
onBeforeEdit:beforeEdit,
onBeforeShowData:beforeShow
});
}
else{
dataGridCopy.reload();
}
}

/**
* 编辑前重新渲染
*/
function beforeEdit(rowData){
if(rowData.record.allotType == 5 || rowData.record.allotType == 7){
//科室,员工下拉选择
rowData.column.editor.type = "select";
rowData.column.editor.valueField = 'id';
rowData.column.editor.textField = 'text';
rowData.column.editor.ext = createAllotCodeData
}else if(rowData.record.allotType == 9){
//固定电脑 输入
rowData.column.editor.type = "text";
rowData.column.editor.valueField = null;
rowData.column.editor.textField = null;
}else{
//其他不进行编辑
return false;
}
}


实现的效果如下  如果分发类型是科室 则点击分发代码的时候是下拉框 如果分发类型是其他标示,则显示的是文本框

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: