Accessing / finding Controls in a View

[kelv1n]

Hi Guys

I'm new to ExtJS, I wrote a basic top-down app, which I'm now converting to the ExtJS MVC. The conversion is going well, but I cannot figure out the best way to access controls defined in specific views.

Basically, I have a Toolbar View which has 2 date fields, couple Combo Boxes and a couple of buttons directly defined in it (i.e. they are not seperate views).

What I need to know, what is the best way to access these individual controls so I can manipulate then? (get and set values etc).

I've found a couple of options, but every article I read says this bad practise -

Solution 1 - Use Ext.getCmp()
Solution 2 - In the controller use this.getToolbar().getComponent('fromdate')
Solution 3 - Use the Ext.ComponentQuery.query()

I used these originally in my top-down script, and I'm converting to MVC to try and avoid these. Also I ran into some problems using getComponent() as I believe it required an ID to be set for each component, which caused errors when the same View was re-used, the reason for this is understandable (2 components/controls with the same id is recipe for disaster).

Could anybody tell me the best practise way of doing this? Perhaps tell me what attribute need to be set in the Combo components and what function to call in the controller to get access to the control?

Thanks

[viewsrc]

Hi,

You might want to look at the .down and .up methods together with firing events.

I make extensive use of this - also for not having to "find" controls in the first place.

For instance you can add an action prop to a button:

Ext.create('Ext.toolbar.Toolbar', {
renderTo: document.body,
width : 500,
items: [
{
xtype: 'button',
text: 'Button',
action: 'deleteall'
},
{
xtype: 'splitbutton',
text : 'Split Button',
action: 'createnew'
}
]
...
}

In your controller you can now - well - controll it via

this.control({
'widgetThatContainsMyButton button[action=createnew]': {
click: this.createSomething
},
'widgetThatContainsMyButton button[action=deleteall]': {
click: this.deleteSomething
}
});


This is all much better explained here:

http://docs.sencha.com/ext-js/4-0/#!/guide/mvc_pt3

[kelv1n]

Hi

Sorry, I should have been more explicit. I want to set a default value on start up, the actual value is dependant on a couple of factors and needs to be set in the Controller Init() or Launch() call.

My question should have asked, how should I get access to the individual Toolbar controls (Combo/Button) in a View from a Controller init call()? I can access the toolbar with the the auto get-method.

Also out of curiosity, does setting a control "action" attribute also work for Combo's and Date fields etc?

Thanks again