easyui datagrid组件的列属性中有一个editor属性,官方介绍如下:

所以,我们可以通过编码实现datagrid行内插入comobox的方式来实现某些场合的需要,具体编码实现如下:
//测试数据:
var contentArr = new Array();
var testObj = {};
testObj.key = id;
testObj.key = "0";
contentArr.push(testObj);
//datagrid 行内comobox内容:
var keyData = [{key:'0',name:'非主键'},{key:'1',name:'主键'}];
//datagrid初始化
$('#mapGrid').datagrid({
striped: true,
'100%',
height: '100%',
selectOnCheck: true,
showHeader: false,
fitColumns: false,
columns:[
[{
field:'map',
'66%',
align:'left'
},{
field:'key',
'33%',
align:'left',
editor:{
type:'combobox',
options:{
valueField:'key',
textField:'name',
data: keyData,
}
}
}]
]
});
//动态插入行数据
insertRow:function(contentArr){
var index = 0;
var allRows = $('#mapGrid').datagrid('getRows');
if(allRows.length > 0){
index = allRows.length;
}
$('#mapGrid').datagrid('insertRow', {
index: index,
row:{
map: contentArr.map,
key: '0'
}
});
$('#mapGrid').datagrid('beginEdit',index);
}
这时直接获取datagrid中comobox的值,只能取到初始设置值,取不到变化之后的值,需要先endEdit如下:
var allRows = $('#mapGrid').datagrid('getRows');
for(var i=0;i<allRows.length;i++){
$('#mapGrid').datagrid('endEdit',$('#mapGrid').datagrid('getRowIndex',allRows[i]));
}
效果图如下:
