20 Dec 2012 1:07 AM #1
Unanswered: How to refresh a tab panel
I have a requirement to refresh the currently shown panel when user comes back to that panel on subsequent times.
I have tree panel on left side and upon selecting nodes i have different panels for each of the node to display on the right hand side.
Below is the scenario where in i need to refresh the tab panel.
1. On the tree panel i clicked the node and on the right hand side a tabbed panel is displayed which has 6 six tabs. I selected the third tab which has two grids in it (one on top and second one on bottom)
2. I clicked on a different node on tree panel and right hand panel is refreshed with new panel which has a form.
3. Now i filled the content in that form and submitted the contents to back-end. This will insert data to the table.
4. Now i clicked on the previous node (same node in tree panel as in step 1) and tabbed panel is displayed with 3rd tab as selected tab. This tab is displayed in the same state as i first left before clicking a node on tree panel. When the tabbed panel is displayed, i want to reload both the grids in that tab as in previous steps, a new data is inserted.
I try to listen for 'render', 'activate' and 'show' events on tab panel and reloading the store which the grids rely on. But some how none of them were triggered when i select the node second time and tabbed panel is displayed.
I'm using ExtJS 4.0.7.
I'm unable to post the code as it's very huge. If someone can help me finding a solution, it will be great.
22 Dec 2012 7:29 AM #2
- Join Date
- Mar 2007
- Gainesville, FL
- Vote Rating
The child items of the tab panel will fire the activate method not the tab panel itself.Mitchell Simoens @LikelyMitch
Sencha Inc, Senior Software Engineer
Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
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 email@example.com
Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!
When posting code, please use BBCode's CODE tags.
1 Jan 2013 11:35 PM #3
Thanks for the response.
I managed to solve the issue with the following solution.
When the form is updated and new record is inserted into DB successfully, in UI i'm setting isDirty flag to TRUE and when the user click on previous node on the tree panel, i'm handling 'select' event and then checking is flag = TRUE and the currently active tab is what i'm interested in, then i'm refreshing the panel of that tab.
It took quite a while to figure out the solution. Thought it may be helpful to somebody.