2

In my app, I have two pagingtoolbar in two views (separate files), how can I query them both in the controller?

dockedItems: [{
    xtype: 'pagingtoolbar',
    store: 'User',
    dock: 'bottom',
    displayInfo: true
}]

bbar: {
    xtype: 'pagingtoolbar',
    store: this.store,
    displayInfo: true
}
CodTango
  • 345
  • 1
  • 3
  • 15

2 Answers2

1

Controllers use ComponentQuery and their selectors are global, so just xtype should work:

Ext.define('MyController', {
    extend: 'Ext.app.Controller',

    init: function() {
        this.control({
            pagingtoolbar: {
                ...
            }
        });
    }
});
Alex Tokarev
  • 4,821
  • 1
  • 20
  • 30
  • Then, if I want to change the configuration, let's say beforePageText. How can I do that, because I tried just beforePageText: 'text' inside, and it doesn't work. – CodTango Dec 08 '14 at 21:55
1

Just adding to Alex Tokarev's answer, if you want to select them at run time, lets say, when you click on a button, you can use: 

 ...
 handler : function () {
      var mytoolbars = Ext.ComponentQuery.query('pagingtoolbar'); // will assign all available toolbars to your mytoolbars array.
 }
 ....
Guilherme Lopes
  • 4,688
  • 1
  • 19
  • 42
  • I guess this only can be used at run time, and I cannot use it in the init function. Am I right? – CodTango Dec 08 '14 at 21:58
  • In the init method this wouldn't work because the components are not rendered yet. – Guilherme Lopes Dec 08 '14 at 21:59
  • CQ selectors do not "work" in Controller.init; they just tell the Controller to listen to particular set of events coming from any component that matches the provided selector. When component is created and initialized it can fire events that may be caught by a Controller; this happens regardless of said components being rendered or not. – Alex Tokarev Dec 08 '14 at 22:03