-
9 Mar 2013 3:23 AM #1
Answered: Updating toolbar on model change
Answered: Updating toolbar on model change
Hi!
I'm searching for a neat way to bind the appearance of a toolbar to a model.
In particular, I have a bunch of buttons that are visible or not depending on the model's state.
Let's say the model is an item the user can watch. If he does (the watch property of the item turns true), I want to hide the toolbar's watch button and show an unwatch button.
The only approach I came up with so far is to add all the buttons (there are 8) to the toolbar, hide them by default and simply call a method that hide()/show() s the respective buttons when the model changes or the view is initialized.
I'm passing the model as record property to the toolbar during it's creation:
My next step would be to add a listener to the toolbar's controller that calls an updateButtons() method whenever the model is changed. But the only event I found is updatedata, which is only called if the toolbar's data is changed.Code:{xtype: 'mytoolbar', record: myModel}
Do I really need to use the data property of the toolbar instead of the record property? Because that would mean I have to call setData() everytime the model changes...
But maybe there is a solution I don't know yet, so any help is appreciated :-)
-
Best Answer Posted by mitchellsimoens
Use the updateRecord method in your toolbar component which will get called anytime the setRecord method is called or when the component is created with the record config.
-
10 Mar 2013 8:11 PM #2Sencha - Senior Forum Manager
- Join Date
- Mar 2007
- Location
- St. Louis, MO
- Posts
- 33,684
- Vote Rating
- 435
- Answers
- 3111
Use the updateRecord method in your toolbar component which will get called anytime the setRecord method is called or when the component is created with the record config.
Mitchell Simoens @SenchaMitch
Sencha Inc, Senior Forum Manager
________________
http://www.JSONPLint.com - Source to lint your JSONP!
Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
https://github.com/mitchellsimoens
Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/
Need more help with your app? Hire Sencha Services services@sencha.com
Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is almost in print!
When posting code, please use BBCode's CODE tags.
-
12 Mar 2013 12:58 PM #3
callParent necessary?
callParent necessary?
Thanks for your help, it works as I need it.
I added the updateRecord method like that:
Code:Ext.define('App.view.Toolbar', { config: { updateRecord: function(newRec, oldRec) { this.callParent(newRec, oldRec); /*** do something ***/ } } });
However, I'm not sure if I need to call callParent or not, as it doesn't seem to change the behaviour I expect.
Edit: Hm... as it turned out, I don't need to overwrite updateRecord at all... listenting the updatedata event is enough and will be fired upon model manipulation. Seems like I had some other bug when I tried that for the first time... thanks anyway.


Reply With Quote