ExtJS4复选框表

ExtJS4复选框表,extjs,Extjs,在ExtJS4中,我想在面板中创建一个表(4*4),每个单元格将生成一个复选框。数据将从Ajax调用中检索。最简单的方法是什么 谢谢,视情况而定。如果您处于表单面板的上下文中,则可以使用开箱即用的支持所需的列式布局的。在这种情况下,添加复选框只需检索对复选框组的引用,在Ajax响应中循环结果,然后添加每个复选框。由于CheckBox组已经支持columns-config,因此可以让extjs在添加复选框时担心将复选框分发到正确的列 下面是一个活生生的例子: 以及守则: // pretend th

在ExtJS4中,我想在面板中创建一个表(4*4),每个单元格将生成一个复选框。数据将从Ajax调用中检索。最简单的方法是什么


谢谢,视情况而定。如果您处于表单面板的上下文中,则可以使用开箱即用的支持所需的列式布局的。在这种情况下,添加复选框只需检索对复选框组的引用,在Ajax响应中循环结果,然后添加每个复选框。由于CheckBox组已经支持columns-config,因此可以让extjs在添加复选框时担心将复选框分发到正确的列

下面是一个活生生的例子:

以及守则:

// pretend this is from ajax
var checkboxes = [
    { name: 'Color', value: 'Red'}, 
    { name: 'Color', value: 'Blue' }, 
    { name: 'Color', value: 'Green' }, 
    { name: 'Color', value: 'Yellow' }
];

// our simple form panel with a checkboxgroup
var panel = Ext.create('Ext.form.Panel', {
    renderTo: Ext.getBody(),
    title: 'Some Checkboxes',
    border: true,
    width: 500,
    items: [{
        xtype: 'checkboxgroup',
        columns: 2
    }]
});

// get the checkboxgroup
var checkboxgroup = panel.down('checkboxgroup');

// loop over result from AJAX and add checkboxes
for (var i = 0; i < checkboxes.length; i++) {
    var item = checkboxes[i];
    checkboxgroup.add({
        xtype: 'checkboxfield',
        boxLabel: item.value,
        name: item.name
    });
}
//假设这是来自ajax
var复选框=[
{name:'Color',value:'Red'},
{name:'Color',value:'Blue'},
{name:'Color',value:'Green'},
{name:'Color',value:'Yellow'}
];
//带有复选框组的简单表单面板
var panel=Ext.create('Ext.form.panel'{
renderTo:Ext.getBody(),
标题:“一些复选框”,
边界:是的,
宽度:500,
项目:[{
xtype:“checkboxgroup”,
栏目:2
}]
});
//获取checkboxgroup
var checkboxgroup=panel.down('checkboxgroup');
//从AJAX循环结果并添加复选框
对于(变量i=0;i