extjs - List items are not shown because of undefined height -

i have list item populated store. once store loads, list not seem resize proper height. height in fact zero. guys have recommendations on having list re-calculate height after loading store?

my view:

            xtype: 'fieldset',             cls: 'damage-list-fieldset',             margin: '',             itemid: 'damagefieldset',             flex: 1,             layout: {                 type: 'fit'             },             items: [                 {                     xtype: 'list',                     action: 'shownotes',                     cls: 'damage-list',                     itemcls: 'x-list-item-label',                     itemid: 'damagelist',                     disableselection: true,                     height: 'auto',                     emptytext: 'no damage has been reported',                     itemtpl: [                         '<table border="0" width="100%">',                         '    <tr>',                         '        <td class="part" width="30%">{part}</td>',                         '        <td class="note" width="30%">{date}</td>',                         '        <td class="type" width="30%">{type}</td>',                         '        <td class="note" width="10%"><div class="count">{notecount}</div></td>',                         '    </tr>',                         '</table>',                         ''                     ],                     store: 'damage',                     grouped: true,                     onitemdisclosure: false                 }             ]         }, 

i realize itemtpl shouldn't have tables in it, let's ignore now.

here's how i'm forcing work. push height controller store load callback.

        ext.getstore('damage').load({         params: {repairorderid: this.repairorderid},         callback: function(records, operation, success) {             if(records.length) {                 report.getcomponent('noteinstruction').sethidden(records.length == 0);                  /* calculate height of damage rows , set it*/                 var location = new array();                 var locationcount = 0;                 for(var = 0; < records.length; i++) {                     if(location.indexof(records[i].data.location) < 0) {                         location.push(records[i].data.location);                         locationcount++;                     }                 }                 var damagerow = 54;                 var damageheader = 56;                 var damageheight = (records.length * damagerow) + (locationcount * damageheader);                 report.getcomponent('damagefieldset').getcomponent('damagelist').setheight(damageheight);                 report.getcomponent('damagefieldset').getcomponent('damagelist').setscrollable(false);             }             ext.viewport.setmasked(false);         },         scope:     }); 

not elegant, because i'm jamming in set height.

so question is, how force list redraw height after getting records store?

the loading process async , callback load not neccessarily affect list.

• height can read list.element.html , not need calculate height, list has list.
• load updates the list automatically.
• the list component of sencha 2.2.1 generated in different way. generates number of visible items plus 1 , switches location of listitems
• height:'auto' best replaced flex: 1

i recommend,

• delete callback
• call store see if there items in store
• set listitem height fix value (do not try set height of each row in list, otherwise use dataview , set height on dataview upatedata event)
• remember dataview way slower list , on list items meant have same height

and last not least can use on list config:

variableheights: true