It's difficult to say with just that, a slight modification to the list example behaves as I would expect:
Code:
Test = {};
Test.userlist = Ext.extend(Ext.List, {
itemSelector: '.list-item',
singleSelect: true,
tpl: '<tpl for="."><div class="list-item"><strong>{firstName}</strong> {lastName}</div></tpl>',
initComponent: function(){
Test.userlist.superclass.initComponent.call(this);
this.on('itemtap', function(dataview, index, item, e){
alert(index);
});
}
});
Ext.setup({
tabletStartupScreen: 'tablet_startup.png',
phoneStartupScreen: 'phone_startup.png',
icon: 'icon.png',
glossOnIcon: false,
onReady: function(){
Ext.regModel('Contact', {
fields: ['firstName', 'lastName']
});
var groupingBase = {
tpl: '<tpl for="."><div class="contact"><strong>{firstName}</strong> {lastName}</div></tpl>',
itemSelector: 'div.contact',
singleSelect: true,
grouped: true,
indexBar: true,
store: new Ext.data.Store({
model: 'Contact',
sorters: 'firstName',
getGroupString: function(record){
return record.get('firstName')[0];
},
data: [{
firstName: 'Tommy',
lastName: 'Maintz'
}, {
firstName: 'Ed',
lastName: 'Spencer'
}, {
firstName: 'Jamie',
lastName: 'Avins'
}, {
firstName: 'Aaron',
lastName: 'Conran'
}, {
firstName: 'Dave',
lastName: 'Kaneda'
}, {
firstName: 'Michael',
lastName: 'Mullany'
}]
})
};
if (!Ext.platform.isPhone) {
new Test.userlist(Ext.apply(groupingBase, {
floating: true,
width: 350,
height: 350,
centered: true,
modal: true,
hideOnMaskTap: false
})).show();
} else {
new Test.userlist(Ext.apply(groupingBase, {
fullscreen: true
}));
}
}
});