I have list screen which acts as a menu - calls card panels defined in the main layout, Chrome

This list object have orignal indexBar .

Code example

コード:
demos.IndexBar =  new Ext.IndexBar({
    store : demos.IndexBarStore ,
    letters:      letters
});

demos.List = new Ext.List({
    width: Ext.is.Phone ? undefined : 300,
    height: 500,
    disclosure: {
        scope: demos.ListStore,
        handler: function(record, btn, index) {
            alert('Disclose more info for ' + record.get('NAME'));
        }
    },
    store: demos.ListStore,
    tpl: '<tpl for="."><div class="item" >{CODE} : <strong>{NAME}</strong> </div></tpl>',
    itemSelector: 'div.item',
    singleSelect: true,
    grouped: true,
    indexBar: demos.IndexBar   //origina indexBar (japanese characters)
//    indexBar: true      //indexBar of default(ex. A-Z)

});
This list operated normally in sencha touch 0.96 .

However, it did not operate normally when updating it to 0.97.

Chorme console error mssage is "Uncaught TypeError: Object has no method 'getItemId'

The thing that operated normally turned out when changing to indexBar of default .

I look over getComponentId , because getItemId was called in getComponentId .

It turned out to differ by 0.96 and 0.97.

Code example (ext-touch-debug.js)
コード:
// Line #16814
    initItems : function(){
        var items = this.items;

        this.items = new Ext.util.MixedCollection(false, this.getComponentId);

        if (items) {                                 // 0.97
            if (!Ext.isArray(items)) {
                items = [items];
            }

            this.add(items);
        }
//        if (items && items.length) {           // 0.96
//            this.add(items);
//        }

    },
This function operates tentatively ,when changing to same 0.96 code .

However, it did not see normally layout.

IndexBar was floating left in the display.

Is there a good method?

Thanks
ushiday