easyUI datagrid的combobox的联动效果

最近做项目，大量用到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;
                        }
                        }

先记录这么多，后期有新想法后再添加