PDA

View Full Version : How to use controlQuery



hotdp
8 Feb 2012, 4:24 AM
Hey,
I hope my threads are not seen as spam, the reason I have a lot of questions are because I work the Designer 8 hours a day.

I have a TabPanel with some views containing som buttons.
I also created a controller and a controller action. I would like to trigger af function when I press a specific button. Right now my controlQuery contains "button" and that results in the event firing all the time fx. when I press the tabPanel buttons.

So what can I do to trigger the correct button?

aconran
8 Feb 2012, 9:21 AM
I hope my threads are not seen as spam, the reason I have a lot of questions are because I work the Designer 8 hours a day.

Certainly not, we hope you are enjoying your demo of the beta and will try to help you through any problems you have.


Right now my controlQuery contains "button" and that results in the event firing all the time fx. when I press the tabPanel buttons.

So what can I do to trigger the correct button?
You will need to give your button some unique property. This could be bound to the text property already in the button like button[text="Save"] or it could be a custom property that you add like action button[action="save"].

In general, I would recommend against binding to the text property as it is likely to change and you dont want to have that dependency.

Custom properties can be added by typing the name of the property in the search field of the property grid and clicking add.

You can also set the name and value at the same time by doing "action: 'save'" and then clicking add.

hotdp
8 Feb 2012, 12:22 PM
I am a little confused and would like to know the correct way to do things.

In ST1 if I had a View with a button I created a event directly on the button (I guess its called Basic Event Binding now?) And called a Ext.dispatch function that called a function in my controller:


Ext.dispatch({ controller: 'Home',
action: 'index'
});

I have also used query from my controller to bind a event to a specific button. But in must cases I used Dispatch.

What is the correct way to do this? There is a lot of buttons, lists, dataviews ect. and I would like to do it the right way. Hope it makes sense?

aconran
8 Feb 2012, 12:54 PM
There is no longer a dispatch method in ST2. It is based strictly on events.

hotdp
8 Feb 2012, 1:05 PM
There is no longer a dispatch method in ST2. It is based strictly on events.

I hoped for some kind of guide line or example...
Fx. if I have a save button in a toolbar and a fieldset with alot of fields in a View.
I would like to "do something" with the data in the fields when I press that save button. What is the correct way to do so? Should I spread out all my functions with basics bindings and inline functions? Or as I did in ST1 "call" the controller or in some other way?

Should I use itemId? Query that?

aconran
8 Feb 2012, 1:59 PM
Yes, add an itemId and then use the controlQuery "#myItemId"

coolfish
20 Sep 2012, 3:09 AM
Adding a #itemId doesn't work .. nor does using a class, or any other thing that I can think of. In the view, I have the following button.




{
xtype: 'button',
cls: 'navButton',
itemId: 'navButton',
text: '...'
}


In the controller, I have tried



control:
{
"#navButton": {
tap: 'onNavButtonTap'
}
}


And nothing. Likewise, button[class='navButton'] (using "s results in malformed generated code) doesn't work. If I use just button as the controlQuery, it works but obviously this results in catching every single button.

Using latest Sencha Architect and ST 2.0.1

edit: to be clear, if I put a unique "id" on the button, eg MyButton123 and then use the control query #MyButton123 then that works. But using itemId (which is, as far as I know, designed to allow you to have multiple buttons that are the same and they each get their own unique id property but you can treat them the same in your controllers) doesn't work, nor does using a class selector.

hotdp
20 Sep 2012, 3:22 AM
Hi,
When using itemId you have to specify where it should look.
So etc. mainNav #navButton

coolfish
20 Sep 2012, 3:24 AM
Thanks for the info! Is this written in the docs somewhere or did you find that out from trial and error?

Problem is i'm going to have these buttons in more than one place .. hence hoping to tie it to a class. Right now I'm doing a not very good thing of listening to all the buttons and then checking to see if the button has the class I'm looking for.

hotdp
20 Sep 2012, 3:27 AM
I don't know about the docs.
I found out via trial/error.

You can hit them all with one query if you want.
So the "same" button is present in many views? Or is the view with the button many places?
Maybe if you could tell a little about the structure and what you would like should happend?

coolfish
20 Sep 2012, 3:29 AM
It's a button that's going to trigger a navigation view. It'll be present in multiple view panels, and when clicked those panels slide off to the side and reveal the navigation bar. The navigation controller listens to those clicks and manages the navigation list and so forth.

hotdp
20 Sep 2012, 3:31 AM
Then just hit the first main view and give all buttons the same itemId and you should be good to go.

aconran
20 Sep 2012, 6:25 AM
When using itemId you can also qualify it via an xtype

for example
button#myItemId will work

#myItemId will not work


In contrast when using an id you don't need to qualify it by xtype

For example
#myId will work

coolfish
20 Sep 2012, 3:01 PM
button#navButton seems to work. This is a really weak spot in the documentation .. I'm trying to do some basic queries like element.up('.myClass') (and all the possible variants I can think of) and not getting anywhere. Coming from jQuery, it's a bit frustrating..!

hotdp
20 Sep 2012, 10:41 PM
button#navButton seems to work. This is a really weak spot in the documentation .. I'm trying to do some basic queries like element.up('.myClass') (and all the possible variants I can think of) and not getting anywhere. Coming from jQuery, it's a bit frustrating..!

Been there myself.
But once you get the hang of the difference between xtype, itemId and id, you will like it :-)