easyui的datagrid使用注意事项

datagrid最简单的使用方式是字段在html里写死,但只支持单层属性,若要使用子属性xx.xxx需要改easyui源码

在easyui的源代码中找到下面的部分,VS可以用

“var.*_.+=.*_.+\[.*_.+\];”

这个正则表达式来查找,会找到好几个,自己挑把。。。

var col=$(_1f9).datagrid("getColumnOption",_1ff);
if(col){
//原来的代码
var _200=_1fd[_1ff];
//...
}

找到上面的内容,就把它替换为:

var col=$(_1f9).datagrid("getColumnOption",_1ff);
if(col){
//修改后的代码
var _200 = eval("_1fd['" + _1ff.replace(/\./g, "']['") + "']");
//...
}

<table id= "tableId">

    <th field='name'>姓名</th>

    <th field='id'>id</th>

</table>

  另一种方式则是用js写字段columns 添加formatter :function(value,row,index){

    return row.xx.xx 

}

<table id= "tableId"></table>

$("#tableId").datagrid({

columns:[[   {field:'empName',title:'面试者姓名',width:100 },  
          {field:'department',title:'当前部门',width:120,formatter: function(value,row,index){
          if (row.department){
                    return row.department.departmentName;
                } else {
                    return value;
          }
         }},
         {field:'position',title:'当前职位',width:280,formatter: function(value,row,index){
          if (row.position){
          if(row.position.jobTitle){
                    return row.position.jobTitle.jobtitleName;
                    }else {
                    return value;
          }
                } else {
                    return value;
          }
         }},
         {field:'repiSortId',title:'面试顺序',width:100,editor:{type:'numberbox'},
          formatter: function(value,row,index){
          return index;
         }},
         {field:'empNo',width:100,hidden:true}
         
]],
onClickRow:function(index){
$('#_innerTable').datagrid('beginEdit', index);
},
url:"../recruitment/ajaxEmpList.do",
queryParams:obj,
onLoadSuccess:function(res){
console.log(res);
}

})

猜你喜欢

转载自blog.csdn.net/wxx729418277/article/details/79468759
今日推荐