JavaScript
Run Code
Open in Fiddle
Ext.application({ name: 'Fiddle', launch: function () { var shows = Ext.create('Ext.data.Store', { fields: ['id', 'show'], data: [{ id: 0, show: 'Battlestar Galactica' }, { id: 1, show: 'Doctor Who' }, { id: 2, show: 'Farscape' }, { id: 3, show: 'Firefly' }, { id: 4, show: 'Star Trek' }, { id: 5, show: 'Star Wars: Christmas Special' }] }); Ext.create('Ext.form.Panel', { renderTo: Ext.getBody(), title: 'Tag Field store.loadData does not refilter the list', height: 400, width: 500, bodyPadding: 15, tbar: [{ xtype: 'button', text: 'Reload', tooltip: 'store.loadData', handler: () => { shows.loadData([{ id: 2, show: 'Farscape' }, { id: 4, show: 'Star Trek' }]) shows.each(r => console.log(r.getData())); } }, { xtype: 'button', text: 'Fix', tooltip: 'Temporary fix', handler: () => { Ext.first('tagfield').onValueCollectionEndUpdate(); } }], items: [{ xtype: 'box', html: `<h2>Steps</h2> <ul> <li>Expand & select all;</li> <li>Press Reload</li> </ul>`, }, { xtype: 'tagfield', fieldLabel: 'Select a Show', store: shows, displayField: 'show', valueField: 'id', queryMode: 'local', value: [1, 2, 3], filterPickList: true }] }); } });