最近做项目,大量用到easyui datagrid的方法,也学到了不少东西,先记录下来,方便以后查找
combobox的联动效果和赋值旁边的表格
{field:'joinUnitName',title:'培训队伍',width:120,align:'center',
formatter:function(value, row){
if(row.isNewRecord == true){
var text = "";
for(var i = 0; i < unitData.length; i ++){
var d = unitData[i];
if(d.value == value){
text = d.text;
}
}
return text;
}else{
return value;
}
},
editor:{type:"combobox",options:{
data : unitData,
textField: "text",
valueField : "value",
editable:false,
required:true,
onSelect:function(){
var varSelect = $(this).combobox('getValue');
var row = $('#jcReportDetail').datagrid('getSelected');
var rowIndex = $('#jcReportDetail').datagrid('getRowIndex',row);//获取行号
var target = $('#jcReportDetail').datagrid('getEditor', { index : rowIndex , field :'joinOrgName'}).target;
target.combobox('clear'); //清除原来的数据
target.combobox('reload', '${root}/sys/getTeamByUnitIdorg.action?unitId=' + varSelect);//联动下拉列表重载
teamSelect(varSelect);
var ed = $('#jcReportDetail').datagrid('getEditor', {index : rowIndex,field : 'joinUnitId'});
$(ed.target).val(varSelect);
var target = $('#jcReportDetail').datagrid('getEditor', { index : rowIndex , field :'joinUserName'}).target;
target.combobox('clear'); //清除原来的数据
target.combobox('reload', '${root}/sys/getUserByOrgIduser.action?orgId=' + varSelect);//联动下拉列表重载
userSelect(varSelect);
}
}
}}
有两点一定要记住:
1、必须要清除原来的数据
2、赋值时被赋值的那一单元格一定要给定一个editor,不然无法赋值
运用combobox的onSelect事件,来进行操作整列
还有一个onChange事件来动态处理combobox的数据源:
onChange : function(value,rowIndex){
var varSelect = $(this).combobox('getValue');
var row = $('#jcReportDetail').datagrid('getSelected');
var rowIndex = $('#jcReportDetail').datagrid('getRowIndex',row);//获取行号
var ed = $('#jcReportDetail').datagrid('getEditor', {index : rowIndex,field : 'wzContent'});
var target = $('#jcReportDetail').datagrid('getEditor', { index : rowIndex , field :'wzContent'}).target;
standDate.length = 0;
var tempDate = jQuery.parseJSON('${stands}');
for(var i = 0; i < tempDate.length; i ++){
var stand = tempDate[i];
if(stand.value.toLowerCase().indexOf(value) != -1 || stand.text.toLowerCase().indexOf(value.toLowerCase())!= -1 || !value){
var o = {};
o.value = stand.value;
o.text = stand.text;
standDate.push(o);
}
}
$(ed.target).combobox("loadData", standDate);
}
选中值后进行保存的时候会发现列显示异常,想要现实name,却发现显示的是id,那么可以使用formatter来进行转格式
formatter:function(value, row){
if(row.isNewRecord == true){
var text = "";
for(var i = 0; i < standDate.length; i ++){
var d = standDate[i];
if(d.text == value){
text = d.text;
}
}
return text;
}else{
var text = "";
for(var i = 0; i < standDate.length; i ++){
var d = standDate[i];
if(d.value == value){
text = d.text;
}
}
if(!text){
text = value;
}
return text;
}
}
先记录这么多,后期有新想法后再添加