Refresh list in form panel - list

Question

I have a list
Ext.define('EvaluateIt.view.RemoveList', {
extend: 'Ext.dataview.List', //'Ext.tab.Panel',
alias : 'widget.removeList',
config: {
width: Ext.os.deviceType == 'Phone' ? null : 300,
height: Ext.os.deviceType == 'Phone' ? null : 500,
xtype: 'list',
store: 'SiteEvaluations', //getRange(0, 9),
itemTpl: [
'<div><strong>Address: {address}</strong></div> '
],
variableHeights: false
}
});
that is rendered in a form panel:
Ext.define('EvaluateIt.view.Remove', {
extend: 'Ext.Container',
fullscreen: true,
config: {
layout: 'vbox',
items: [
{
xtype : 'toolbar',
docked: 'top'
},
{
flex: 1,
xtype: 'removeList'
}
]
}
});
How do I refresh the list if it changes? For example, I have a method that onTap of an item in the list a MsgBox will give the option to delete that record from the store by given index. I tried a load() after doing the removal of the record, but this does not do the refresh (in a browser a refresh does it and in simulator, I have to exit and go back into the app).
Here is the MsgBox:
Ext.Msg.show({
title:'Are you sure?',
buttons: Ext.MessageBox.YESNO,
//animateTarget: 'mb4',
//icon: Ext.MessageBox.WARNING,
fn: function(buttonId) {
//alert('You pressed the "' + buttonId + '" button.');
if (buttonId === 'yes') {
evaluationsStore = Ext.getStore(evaluationStore);
index = evaluationStore.findExact('id', id); // get index of record
console.log('index: ' + index);
evaluationStore.removeAt(index); // remove record by index
evaluationStore.sync();
alert('It is gone!');
Ext.getStore(evaluationStore).load();
}
else {
alert('Unscathed!');
}
}
});
Grazie!

Answer 1

After the record is deleted from the database your list should update automatically. Store will generate 'update' event and list that has store will refresh it content. Are you saying it doesn't work this way for you?