我正在构建一个checkboxgroup,其中包含从商店获取的商品,这些商品会在Ext.OnReady函数中加载。我试图将此复选框组添加到formpanel并在add()调用中得到此错误。 'events'为null或不是对象。
这是我正在尝试的代码..
Ext.onReady(function () {
{
store.each(function (record) {
var itemID = record.get('itemID')
var itemDesc = record.get('itemDesc');
jsonDataArray.push([itemID,itemDesc]);
});
myCheckboxGroup = new Ext.form.CheckboxGroup({
id: 'chk1',
xtype: 'checkboxgroup',
width: 520,
border: true,
items: jsonDataArray
});
myForm.add(myCheckboxGroup);
myForm.doLayout();
}
var myForm = new Ext.form.FormPanel({
id: 'myForm',
region: 'center',
border: true,
autoHeight: true,
items: myCheckboxGroup
});
答案 0 :(得分:1)
使用xtype包含布局管理器创建的所有内容,确保为组提供一些要呈现的复选框,并为表单定义布局类型。您还需要将此表单放在其他内容(如窗口)或将其呈现给页面主体。
var myForm = new Ext.form.FormPanel(
{
id: 'myForm',
region: 'center',
layout: 'form',
border: true,
autoHeight: true,
items: [{
id: 'chk1',
xtype: 'checkboxgroup',
width: 520,
border: true,
items: [
{boxLabel: 'Item 1', name: 'cb-1'},
{boxLabel: 'Item 2', name: 'cb-2', checked: true}, // checked
{boxLabel: 'Item 3', name: 'cb-3'},
]
}]
});
现在只需用您的JSON版本代替'items'代码。在尝试此操作之前,请确保已从Ajax调用返回并将响应转换为JSON。
有关详细信息,请参阅有关此主题的论坛主题:ExtJs Forum Thread
答案 1 :(得分:0)
new Ext.form.FormPanel({
title: 'Test Form',
labelWidth: 120,
width: 350,
padding: 10,
tbar: [{
text: 'Add CheckboxGroup',
handler: function () {
formPanel.add({
xtype: 'checkboxgroup',
fieldLabel: 'My CheckboxGroup',
columns: 1,
items: items
});
formPanel.doLayout();
this.disable();
}
}],
items: comboBox,
renderTo: 'output'
});
在这里演示http://ext4all.com/post/extjs-3-add-a-checkboxgroup-dynamically-to-a-form