You check if the div has the class "ui-resizable" but when the ajax
content loads it doesn't change the class but only the content.
So you have to check if the handle div is there like this:
if ($('.ui-resizable-handle',panel).length==0) {
panel.resizable();
}
On 9 אפריל, 23:49, imbunche <[email protected]> wrote:
> Klaus,
>
> Sorry to keep beating this almost dead horse, but I'm still having a
> hard time making the ui.panel stay resizable. One last demo that (I
> think) gets at the heart of the matter:
>
> http://imbunche.com/jquery/tabs/tabs-ajax-load.html
>
> If I set the cache on these Ajax tabs to true, the ui.panel remains
> resizable no matter how many times you click on the tabs.
>
> If the cache is set to false, once you click on the tabs more than
> once the handle disappears and the panel is no longer resizable.
> There has to be a way to set the ui.panel to be resizable in such a
> way that it stays resizable even if you reload the content in the
> panel.
>
> On Apr 8, 5:22 am, Klaus Hartl <[email protected]> wrote:
>
> > Oh, I think it's still making it resizable more than once... try:
>
> > $('#tabs').tabs({
> > load: function(event, ui) {
> > var panel = $(ui.panel);
> > if (!panel.hasClass('ui-resizable')) {
> > panel.resizable();
> > }
> > }
>
> > });
>
> > Shorter version:
>
> > $('#tabs').tabs({
> > load: function(event, ui) {
> > $(ui.panel).not('.ui-resizable').resizable();
> > }
>
> > });
>
> > --Klaus
>
> > On 8 Apr., 07:13, imbunche <[email protected]> wrote:
>
> > > Thanks again for the help. So this is another small step forward. I
> > > swapped in the new code here:
>
> > >http://imbunche.com/jquery/tabs/tabs-ajax-load.html
>
> > > With that change in place things are working as I'd like, but only the
> > > FIRST time I click on one of the tabs. Once I click on a tab for the
> > > second time (for example, if I load the page, click on Tab 2, and then
> > > click back to Tab 1) the resize handle vanishes and I can no longer
> > > resize the panel. I want the ability to resize the panel to persist
> > > for all the tabs, no matter how many times you click on them.
>
> > > On Apr 8, 1:00 am, Klaus Hartl <[email protected]> wrote:
>
> > > > Try:
>
> > > > $('#tabs').tabs({
> > > > load: function(event, ui) {
> > > > $(ui.panel).resizable();
> > > > }
>
> > > > });
>
> > > > You only need to make the one panel resizable that has jsut been
> > > > loaded. Does it work?
>
> > > > --Klaus
>
> > > > On 8 Apr., 00:51, imbunche <[email protected]> wrote:
>
> > > > > Thanks! I think I'm almost there. I added the load function and now
> > > > > when I first load the page I'm able to resize the .ui-tabs-panel div,
> > > > > but when I click on any of the other tabs and/or click back to the
> > > > > first tab the handle (and, along with it, the ability to resize the
> > > > > panel) disappears. See here:
>
> > > > >http://imbunche.com/jquery/tabs/tabs-ajax-load.html
>
> > > > > I want to make it so you can resize that panel once you've clicked on
> > > > > one of the tabs, not just when the page loads. Along with that I'd
> > > > > like to keep the newly re-sized panel the same height for each tab.
>
> > > > > On Apr 7, 5:15 pm, Klaus Hartl <[email protected]> wrote:
>
> > > > > > Since you pulling in new content with every load you need to make it
> > > > > > resizable after every load... something like:
>
> > > > > > $('#whatever').tabs({
> > > > > > load: function() {
> > > > > > // make resizable here...
> > > > > > }
>
> > > > > > });
>
> > > > > > --Klaus
>
> > > > > > On 7 Apr., 16:52, imbunche <[email protected]> wrote:
>
> > > > > > > Thanks for the suggestion. Unfortunately in the "much more
> > > > > > > complicated layout" I mentioned above I can't make the entire
> > > > > > > #tabs
> > > > > > > div resizable. In that set of tabs, the tab list items are
> > > > > > > stacked
> > > > > > > one on top of the other to the left of the tab content. What I
> > > > > > > need
> > > > > > > is to be able to resize the div that the AJAX content gets loaded
> > > > > > > into
> > > > > > > (.ui-tabs-content) and not the entire #tabs div.
>
> > > > > > > The odd thing is this works - making the .ui-tabs-content div
> > > > > > > resizable - as long as the content of .ui-tabs-content isn't
> > > > > > > getting
> > > > > > > pulled in dynamically. I'm just wondering if I'm missing
> > > > > > > something to
> > > > > > > do with theming static vs. dynamic tabs. It looks like the markup
> > > > > > > that's generated is the same, but it's definitely not working as
> > > > > > > expected.
>
> > > > > > > On Apr 7, 7:36 am, Shedokan <[email protected]> wrote:
>
> > > > > > > > Why don't you use $('#tabs').resizable();?
>
> > > > > > > > On 7 אפריל, 09:14, imbunche <[email protected]> wrote:
>
> > > > > > > > > I setup two really basic pages to try to troubleshoot a
> > > > > > > > > problem I'm
> > > > > > > > > having on a much more complicated layout.
>
> > > > > > > > >http://imbunche.com/jquery/tabs/tabs.htmlhttp://imbunche.com/jquery/t...
>
> > > > > > > > > On the first page I'm using the example code for UI Tabs
> > > > > > > > > (stripped out
> > > > > > > > > of the index page that comes with a full download of the
> > > > > > > > > latest
> > > > > > > > > version). All I've added is the code to make the
> > > > > > > > > .ui-tabs-panel (the
> > > > > > > > > panel beneath the tabs) resizable. It's a little bit wonky,
> > > > > > > > > but the
> > > > > > > > > handle shows up in the bottom right corner and the panel is
> > > > > > > > > indeed
> > > > > > > > > resizable.
>
> > > > > > > > > On the second page I've switched the tabs so they pull their
> > > > > > > > > content
> > > > > > > > > from other html files - so-called AJAX Mode
> > > > > > > > > (http://docs.jquery.com/UI/
> > > > > > > > > Tabs#Ajax_mode). The tabs themselves work, but even though
> > > > > > > > > .ui-tabs-
> > > > > > > > > panel is still the class given to these dynamically loaded
> > > > > > > > > divs
> > > > > > > > > they're no longer resizable.
>
> > > > > > > > > I'm guessing there's something really obvious I'm missing,
> > > > > > > > > but I've
> > > > > > > > > been at it for hours so any help would be appreciated.
>
> > > > > > > > > Cheers,
> > > > > > > > > Chris
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
