PDA

View Full Version : FormPanel, Checkbox, for loop



rothaar
18 Aug 2008, 12:26 PM
Heya gang. Having a little trouble with the following snippet of code:



var logTbl = CE('table', 'tblLoggingCats');
logTbl.setAttribute('class', 'loggingTable');
logTbl.setAttribute('className', 'loggingTable');
Application.contDocBody.dom.appendChild(logTbl);

for(i=0;i<logCategoryObj.modules.length;i++) {
if (i % 3 == 0) {
var modRow = logTbl.insertRow(logTbl.rows.length);
}
var modCell = modRow.insertCell(modRow.cells.length);
modCell.setAttribute('class', 'loggingCell');
modCell.setAttribute('className', 'loggingCell');
var catName = new Ext.form.Checkbox({
boxLabel: _(logCategoryObj.modules[i].name)
});
var catList = [];
for(j=0;j<logCategoryObj.modules[i].categories.length;j++) {
catList[j] = new Ext.form.Checkbox({
boxLabel: _(logCategoryObj.modules[i].categories[j].name)
});
}
new Ext.form.FormPanel({
baseCls: 'x-plain',
defaults: {
border: false,
hideLabel: true
},
items: [
catName,
catList
]
}).render(Ext.get(modCell));
}


My logCategoryObj is an object containing (currently) 7 "modules", each of which have a "name" and a list of between 1 and 7 "categories" (each of which have both a "name" and an "enabled" boolean value).

When I run this, my category names all render beautifully, with their associated checkboxes ('check all' logic to be added later), but none of the "catList[]" names or checkboxes show up (just whitespace where maybe one of them would fit). When I drill down with the IE Dev toolbar, I see that only the 'x-panel-body' div is being created. Does anyone see a syntax error I'm overlooking?

rothaar
19 Aug 2008, 4:09 AM
This is still stumping me. I've rearranged the code a couple different ways, all with the same results mentioned above. Certainly I must be missing something elementary. Anybody see what I'm doing wrong?

rothaar
19 Aug 2008, 4:30 AM
There must be something wrong with how I'm calling my catList array of checkboxes in the 'items' list for the FormPanel. If I explicitly call a single one of the checkboxes in the array...



var logTbl = CE('table', 'tblLoggingCats');
logTbl.setAttribute('class', 'loggingTable');
logTbl.setAttribute('className', 'loggingTable');
Application.contDocBody.dom.appendChild(logTbl);

for(i=0;i<logCategoryObj.modules.length;i++) {
if (i % 3 == 0) {
var modRow = logTbl.insertRow(logTbl.rows.length);
}
var modCell = modRow.insertCell(modRow.cells.length);
modCell.setAttribute('class', 'loggingCell');
modCell.setAttribute('className', 'loggingCell');
var catName = new Ext.form.Checkbox({
boxLabel: _(logCategoryObj.modules[i].name)
});
var catList = [];
for(j=0;j<logCategoryObj.modules[i].categories.length;j++) {
catList[j] = new Ext.form.Checkbox({
boxLabel: _(logCategoryObj.modules[i].categories[j].name)
});
}
new Ext.form.FormPanel({
baseCls: 'x-plain',
defaults: {
border: false,
hideLabel: true
},
items: [
catName,
catList[0]
]
}).render(Ext.get(modCell));
}


...like so, it renders that one item (first 'categories.name' for each 'modules'). Why can't I just call the entire array like in my first post?

Condor
19 Aug 2008, 4:50 AM
Use:


items: [catName].concat(catList)

rothaar
19 Aug 2008, 4:57 AM
Condor! You are, again, my hero. Thanks for the tip, and /facepalm on me for not knowing to do that myself.