Reputation: 61
I am trying to add a search bar to a nested list. Searchbar is added and works fine when i try it using console.log It finds me the record i am looking for but I can't figure out how to "refresh" the nestedlist in order to show only the search results. If i use "mystore.load()" it takes me back to root node.
Ext.define('Sencha.controller.FileList', {
extend: 'Ext.app.Controller',
requires: [
'Ext.MessageBox'
],
config: {
refs: {
homeBtn: 'button[iconCls=home]',
searchField: 'searchbar'
},
control: {
'button[iconCls=home]': {
tap: 'onbtnHomeTap'
},
'searchField' : {
action : 'onKeyUp'
}
}
},
onbtnHomeTap: function () {
console.log('bthome tapped');
//reloads the list!
Ext.getCmp('myList').getStore().load();
console.log(Ext.getCmp('searchfield').getValue());
},
onKeyUp: function(field) {
console.log('inside searchbar_event');
/* this.doFilter({
q: field.getValue()
});*/
Ext.getStore('NestedListStore').findRecord('text', field.getValue());
},
/**
* @private
* Listener for the 'filter' event fired by the listView set up in the 'list' action. This simply
* gets the form values that the user wants to filter on and tells the Store to filter using them.
*/
doFilter: function(values) {
var store = Ext.getStore('NestedListStore'),
filters = [];
Ext.iterate(values, function(field, value) {
filters.push({
property: field,
value : value
});
});
store.clearFilter();
store.filter(filters);
store.load();
}
});
Upvotes: 1
Views: 672
Reputation: 61
Ok People, I answered my own question:
a simple
Ext.getCmp('yourNestedListID').goToNode( Ext.getStore('NestedListStore').findRecord('text', field.getValue()));
did the trick Hope this can be helpful to others.
Upvotes: 1