Javascript 列上带有radiobutton的ExtJS GridPanel
所以我有一个普通的网格,有一些列:Javascript 列上带有radiobutton的ExtJS GridPanel,javascript,extjs,radio-button,extjs6,gridpanel,Javascript,Extjs,Radio Button,Extjs6,Gridpanel,所以我有一个普通的网格,有一些列: { xtype : 'gridpanel', mode : "MULTI", region : 'center', title : "grid",
{
xtype : 'gridpanel',
mode : "MULTI",
region : 'center',
title : "grid",
id : 'datagridResult',
margin : '10 5 5 5',
columns : [
{
xtype : 'gridcolumn',
dataIndex: 'TEST',
flex : 0.25
},
{
xtype : 'gridcolumn',
dataIndex: 'Test2'
flex : 2
},
//...
我想再添加3列单选按钮(每列一个按钮)。我试过这样的方法:
{
xtype : 'gridcolumn',
text : "FOR"
dataIndex: 'for',
flex : 1,
editor: {
xtype : 'radiofield',
name : 'Regex',
inputValue: 'Checked'
},
}
但它不起作用。所以我来这里是想问你一些建议
但它不起作用。所以我来这里是想问你一些建议
在ExtJS中,有xtype:。
小部件列配置有一个小部件配置对象,该对象指定一个xtype,以指示该列单元格中属于哪种类型的小部件或组件
我已经创建了一个演示。这将显示出它是如何工作的。希望这对你有帮助
Ext.create('Ext.data.Store', {
storeId: 'simpsonsStore',
fields: ['name', 'email', 'phone', {
name: 'checked',
type: 'boolean',
defaultValue: true
}],
data: [{
name: 'Lisa',
email: 'lisa@simpsons.com',
phone: '555-111-1224'
}, {
name: 'Bart',
email: 'bart@simpsons.com',
phone: '555-222-1234'
}, {
name: 'Homer',
email: 'homer@simpsons.com',
phone: '555-222-1244'
}, {
name: 'Marge',
email: 'marge@simpsons.com',
phone: '555-222-1254'
}]
});
Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
columns: [{
text: 'Name',
dataIndex: 'name'
}, {
text: 'Email',
dataIndex: 'email',
flex: 1
}, {
text: 'Phone',
dataIndex: 'phone'
}, {
text: 'Status',
width: 150,
xtype: 'widgetcolumn',
dataIndex: 'checked',
onWidgetAttach: function (column, widget, record) {
widget.down(`[inputValue=${record.get('checked')}]`).setValue(true);
},
widget: {
xtype: 'radiogroup',
items: [{
boxLabel: 'Yes',
inputValue: true
}, {
boxLabel: 'No',
inputValue: false
}]
}
}],
height: 200,
width: 400,
renderTo: Ext.getBody()
});
谢谢,这正是我想要的