1. #1
    Ext JS Premium Member mapo's Avatar
    Join Date
    Mar 2007
    Location
    Switzerland
    Posts
    75
    Vote Rating
    0
    mapo is on a distinguished road

      0  

    Default TabPanel: loading content w/out AJAX

    TabPanel: loading content w/out AJAX


    Hi,
    I have a TabPanel with 3 tabs. When I click on the third one I would like to reload the whole page (and then show the new page with the third tab activated). I am a bit confused since I didn't find an example for this case (maybe because I'm wrong ). What's the best pattern to do that? Can I do it w/out using AJAX (setUrl(...)) ?

    Thank you!

    Massimo

  2. #2
    Sencha User
    Join Date
    Mar 2007
    Posts
    7,854
    Vote Rating
    4
    tryanDLS is on a distinguished road

      0  

    Default


    Not sure why you'd want to do this, b/c you're essentially saying rebuild the page from scratch. You don't want to do an Ajax request, you just want to do a HTTP Get on some page (or the same page). You'd then have to pass something back so your page load routine would know to activate the 3rd tab. Obviously you're going to somehow separate the click (which calls activate) from the activate (which does a page load), otherwise your just gonna loop everytime the page reloads and activates tab 3. You may want to rethink your flow - this idea doesn't seem to make sense.

  3. #3
    Ext JS Premium Member mapo's Avatar
    Join Date
    Mar 2007
    Location
    Switzerland
    Posts
    75
    Vote Rating
    0
    mapo is on a distinguished road

      0  

    Default


    Well, let's put it like this. Actually I have 8 tabs and not 3, and the content of every tab requires a moderate amount of DB queries in order to be created. So I don't want to load the content of all the 8 tabs in one single request. The natural solution would be to lazy load the content through ajax requests. But I experienced some problems with this approach, especially with the extensive JS code that is included in my Ajax response. So a reasonable solution would be to reload the page when the tab gest clicked. This doesn't make sense? If I'm not wrong 99% of the pages out there work like this...!
    Thank you fo the answer!

    Massimo

  4. #4
    Sencha User
    Join Date
    Mar 2007
    Posts
    7,854
    Vote Rating
    4
    tryanDLS is on a distinguished road

      0  

    Default


    Yes, but what's the point of having multiple tabs if every tab load is going to reload the page and wipe out the previously loaded tabs?

  5. #5
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,502
    Vote Rating
    47
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Quote Originally Posted by mapo
    Well, let's put it like this. Actually I have 8 tabs and not 3, and the content of every tab requires a moderate amount of DB queries in order to be created. So I don't want to load the content of all the 8 tabs in one single request. The natural solution would be to lazy load the content through ajax requests. But I experienced some problems with this approach, especially with the extensive JS code that is included in my Ajax response. So a reasonable solution would be to reload the page when the tab gest clicked. This doesn't make sense? If I'm not wrong 99% of the pages out there work like this...!
    Thank you fo the answer!

    Massimo
    You can specify that scripts in Ajax responses are evaluated:

    http://www.yui-ext.com/playpen/yui-ext.0.40/docs/

    Specifically:

    http://www.yui-ext.com/playpen/yui-e...er.html#update

    Turned on for a specific instance of UpdateManager by:

    http://www.yui-ext.com/playpen/yui-e...ml#loadScripts

    Turned on for all by:

    YAHOO.ext.UpdateManager.defaults.loadScripts = true;

    Manually update an Element:

    http://www.yui-ext.com/playpen/yui-e...nt.html#update

    Tyyan is right. It's pointless having a tab if youaer reloading a page. It's just a link then! 99% of pages out there are non-Ajax.

  6. #6
    Ext JS Premium Member mapo's Avatar
    Join Date
    Mar 2007
    Location
    Switzerland
    Posts
    75
    Vote Rating
    0
    mapo is on a distinguished road

      0  

    Default


    tryanDLS, Animal,

    thank you very much for your help.
    Actually I already tried to make the UpdateManager evaluate my scripts. But for some reasons it didn't evaluate all of them (e.g. some YAHOO's tooltips) although the code was correct (and correclty evaluated if rendered in a non-AJAX response).

    Regarding you statements about tabs in a non AJAX world, of course I see your point and I see I'm somehow trying to misuse this excellent component.

    Massimo

  7. #7
    Sencha User
    Join Date
    Mar 2007
    Posts
    7,854
    Vote Rating
    4
    tryanDLS is on a distinguished road

      0  

    Default


    If the scripts you load via loadScripts=true, also try to bring in new css files, the css is not going to be processed. You need to include those files in your base page. There are a couple of threads regarding this if you need more info.

Similar Threads

  1. Tab Panel examples for loading by ajax not working.
    By jatinder in forum Ext 1.x: Help & Discussion
    Replies: 9
    Last Post: 7 Nov 2007, 5:12 AM
  2. TabPanel AJAX loading problem!
    By punitshah in forum Ext 1.x: Help & Discussion
    Replies: 0
    Last Post: 23 Jan 2007, 2:24 AM
  3. AJAX Tab not loading
    By anilcj in forum Ext 1.x: Bugs
    Replies: 7
    Last Post: 28 Dec 2006, 8:57 PM
  4. Loading a ContentPanel (or TabPanel)
    By jamaljohnson in forum Ext 1.x: Help & Discussion
    Replies: 11
    Last Post: 17 Nov 2006, 8:49 AM

Thread Participants: 2