PDA

View Full Version : appendChild dynamically



4myGod
30 Sep 2009, 2:57 AM
Ok, so I have a table:


<table id='log-list'>
</table>

I want to add thead with a tr:

Ext.DomHelper.append('log-list', {tag: 'thead', children:
{tag: 'tr', children: [
{tag: 'th', html: 'Reinforcements'},
{tag: 'th', html: 'Conquered Territories'},
{tag: 'th', html: ''}
]}
});

Now then I want to add the tbody:


Ext.DomHelper.append('log-list', {tag: 'tbody'});

Now though I want to do a for, and in each part of the for I want to add th's to the thead and rows to the tbody.

I tried giving them variables like:

var tableBody = Ext.DomHelper.append('log-list', {tag: 'tbody'});

then adding:

var tableRow = Ext.DomHelper.append(tableBody, {tag: 'tr',cls: even, children: [
{tag: 'td', cls: 'reinforcements', html: logStats[p].reinforcements},
{tag: 'td', cls: 'conquered', html: logStats[p].conquered},
{tag: 'td', cls: 'lib gray', html: 'Troops Lost in Battle:'}
]});

I obviously have no idea what I am doing. I have read the API many times, but I don't get what it means:

* Appends the passed element(s) to this element
* @param {String/HTMLElement/Array/Element/CompositeElement} el
* @return {Ext.Element} this
*/
appendChild: function(el){
return GET(el).appendTo(this);
},


So how do I assign an element to a var as I create (so I don't need an id for it) and then appendChildren to it?

BitPoet
30 Sep 2009, 3:36 AM
The only thing perhaps wrong in the above code I can see is the unquoted 'even' in the row object, apart from that it works like a charm.

4myGod
30 Sep 2009, 3:43 AM
var tableHead = Ext.DomHelper.append('log-list', {tag: 'thead', children:
{tag: 'tr', children: [
{tag: 'th', html: 'Reinforcements'},
{tag: 'th', html: 'Conquered Territories'},
{tag: 'th', html: ''}
]}
});
var tableBody = Ext.DomHelper.append('log-list', {tag: 'tbody'});I try to put those into vars so I can appendChildren to them at separate times back and forth as the loop is running, however what shows up is:


<tbody>
<thead><tr>....th's....</tr></thead>
<tbody>I am assuming the rest of my code isn't working because of the mess up on the tbody's and thead's. So maybe my problem is within that.