How can i dynamically create the table rows in extjs

Question

I have this fiddle working for combobox

http://jsfiddle.net/f2JuX/16/

This adds tags to the td element.

All i want is that instead of adding td element before the main td and then appends further tags with span , i want that thei create the separate row of tags below the combobox

so that the table grows down wards

This is the code he used

var triggerWrap = me.triggerWrap,
    tr = triggerWrap.down('tr');
// create table cell
me.selectedCell = tr.createChild({
    tag: 'td',
    cls: Ext.baseCSSPrefix + 'selected-cell'
});

then this

    me.selectedCell.createChild({
        tag: 'span',
        html: display + '<span class="remove-tag"></span>',
        cls: 'tag tag-' + value,
        recordValue: value
    });

I am not able to find how can i add table below there

Answer 1

Just add rows to triggerWrap instead of selectedCell . selectedCell is not required there.

Working sample: http://jsfiddle.net/f2JuX/19/

But you should notice, that extending height of the component may result with layout issues. In example I have added calling parent layout to avoid that in this particular case, but still problem may return in real life usage.