Sencha Touch - deselect list item?

Question

I'm working on a Sencha Touch application, and have a list of contacts. When a list item is tapped, an ActionSheet is displayed showing some basic functions (such as call, delete and ignore). Unfortunately, when the user taps and the ActionSheet is fired, the List item remains selected underneath the overlay (see the screenshot below):

Here's the function bound to the itemTap event:

itemTap: function(list, index)
{
    // Deselect the selected record:
    var currentRecord = list.getStore().getAt(index);
    currentRecord.forename      = currentRecord.get('forename');
    currentRecord.surname       = currentRecord.get('surname');
    currentRecord.phoneNumber   = currentRecord.get('phoneNumber');
    currentRecord.shortFullName = currentRecord.forename + ' ' +  currentRecord.surname[0];

    list.getStore().deselect(index, true);

    callButton.setText('Call ' + currentRecord.shortFullName + ' (' + currentRecord.phoneNumber + ')');
    unfriendButton.setText('Remove ' + currentRecord.shortFullName + ' as friend');
    friendActionSheet.show();
}

Unfortunately, list.getStore().deselect(index, true) returns the following error: Object [object Object] has no method 'deselect'

Any ideas on what I could be doing wrong, or how I can achieve this?

Answer 1

This works for me:

    listeners: {
        itemtap: function(dv, ix, item, e) {
            // Clear the selection soon
            setTimeout(function(){dv.deselect(ix);},500);
        }
    }

Answer 2

In Sencha Touch 2, use disableSelection: true, while creating a list

Ext.define('App.view.NewsList',{
extend: 'Ext.List',
xtype: NEWS_LIST,

config: {
    store: NEWS_FEED,
    //deselectOnContainerClick: true,// not working in Sencha Touch 2
    disableSelection: true, // since Sencha Touch 2
    itemTpl: '{heading}'
} 
});

Answer 3

If you want to clear the whole list:

var selModel = app.views.notesList.deselect(app.views.notesList.getSelectedRecords());

Answer 4

setTimeout is really not a good solution here. It should be like this:

 listeners: {
        itemtap: function(list, ix, item, e) {
            // Clear the selection soon
            list.deselect(list.getSelectedRecords());
        }
    }

Answer 5

I haven't tried to recreate your problem but you may want to try:

list.deselect(currentRecord, true);

After you do that you may have to call

doLayout()

or

doComponentLayout()

to refresh the view.

Answer 6

This drove me INSANE.

While the approved answer will work, its worth noting that you can do it with a delay(like nested list does too) like this:

    var selModel = app.views.VideosList.items.items[0].getSelectionModel();
    Ext.defer(selModel.deselectAll, 200, selModel);

I put that in my controller (so its called when the view changes), where app.views.VideosList is my main panel and app.views.VideosList.items.items[0] is the list in that panel.

Answer 7

this did it for me (sencha touch 2.3):

list = Ext.Viewport.down('nestedlist');
list.getActiveItem().deselectAll();