欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Extjs EditorGridPanel中ComboBox列的显示问题

程序员文章站 2022-03-20 23:25:57
为了解决这个问题需要在editorgridpanel的columnmodel中显示combobox的地方使用renderer属性,重新渲染,方法如下: 复制代码 代码如下:...
为了解决这个问题需要在editorgridpanel的columnmodel中显示combobox的地方使用renderer属性,重新渲染,方法如下:
复制代码 代码如下:

//部门列表
var comboxdepartmentstore = new ext.data.store({
proxy: new ext.data.httpproxy({
url: "getdepartmentjson.aspx",
method: 'get'
}),
reader: new ext.data.jsonreader({
root: 'data',
totalproperty: 'totalcount',
fields: [
{ name: 'departmentid', mapping: 'id' },
{ name: 'departmentname', mapping: 'name' }
]

})
});
//根据combobox列表中对应的id的值来渲染
function renderermetertypecombobox(value, p, r) {
var index = comboxdepartmentstore.find(ext.getcmp('cbdepartment').valuefield, value);
var record = comboxdepartmentstore.getat(index);
var displaytext = "";
if (record == null) {
return value;
} else {
return record.data.astype; // 获取record中的数据集中的display字段的值
}
}


var sm = new ext.grid.checkboxselectionmodel();

var cm = new ext.grid.columnmodel({
columns: [sm, new ext.grid.rownumberer(), {
header: 'id',
dataindex: 'id',
hidden: true
}, {
header: '姓名',
width: 40,
dataindex: 'name'
}, {
header: '所属部门',
width: 80,
dataindex: 'department',
renderer: rendererdepartmentcombobox,
editor: new ext.form.combobox({
id: "cbdepartment", //必须有
forceselection: true,
selectonfocus: true,
typeahead: true,
triggeraction: 'all',
store: comboxdepartmentstore,
mode: 'local',
displayfield: 'departmentname',
valuefield: 'departmentid',
lazyrender: true
})
}],
defaults: {
zsortable: true,
menudisabled: false,
width: 100
}
});

var editgrid = new ext.grid.editorgridpanel({
id: 'testgrid',
store: store, //editorgridpanel使用的store
trackmouseover: true,
disableselection: false,
clickstoedit: 1, //设置点击几次才可编辑
loadmask: true,
autoheight: true,
cm: cm,
sm: sm,
viewconfig: {
columnstext: '显示/隐藏列',
sortasctext: '正序排列',
sortdesctext: '倒序排列',
forcefit: true,
enablerowbody: true
},
bbar: new ext.pagingtoolbar({
pagesize: 25,
store: store,
displayinfo: true,
displaymsg: '当前显示从{0}至{1}, 共{2}条记录',
emptymsg: "当前没有记录"
})
});