Richard, thank you, but that didn't work. for the same reasons as
before. if I try to reload the tab I am viewing then it doesn't work.
I dug around some and found 1. why this is happening 2. a hack to make
it work.
1. if I attempt to selected the selected tab and collapsible is false
the operation is doesn't fire (aborted?).
2. if I select the selected tab and collapsible is true the tab is
minimized.
3. the spinner is calculating hieght/width/margin when spinner() is
called to aline the icons to the textbox. it's using
element.outerHeight() and element.outerWidth() as part of the
calculation.
4. it seems that the panel's content is appended to the browser DOM
after load but before show. this is why the spinner formats work in
the call to show, not load.
does that make sense?
hacks:
1. Hidden hack tab
<div class="tabs">
<ul>
<li><a href="page1.htm">tab 1</a></li>
<li><a href="page2.htm">tab 1</a></li>
<li style="display:none;"><a href="#HACK">&nbps;</a></li>
</ul>
<div id="HACK" style="display:none;"></div>
</div>
var HIDDEN_TAB_INDEX = $(".tabs").("option", "length")-1;
var tabs = $(".tabs");
var index = tabs.tabs("option", "selected");
tabs
.tabs("url", index, url)
.tabs("select", HIDDEN_TAB_INDEX)
.tabs("select", index);
this works, but causes a "flash" as you will see the panel shrink and
expand.
2. Collapsible hack
<div class="tabs">
<ul>
<li><a href="page1.htm">tab 1</a></li>
<li><a href="page2.htm">tab 1</a></li>
</ul>
</div>
$(".tabs").tabs({collapsible:true});
var tabs = $(".tabs");
var index = tabs.tabs("option", "selected");
tabs
.tabs("url", index, url)
.tabs("select", index) //collapse
.tabs("select", index); //expand
which again produces a flash with the shrinking/expanding. it also
means the user can collapse any tab, which I don't want.
3. Hard code the style values.
$(".tabs").tabs({
load: function(event, ui){
$(".spinner", ui.panel).spinner().find(".ui-spinner-
buttons").css({hard coded values});
}
});
I like that I don't get a "flash" but it's also dependent on the
styling of the input box not changing. if it does then I have to
change my script.
right now I'm leaning towards option 3 since it's not used in that
many places.
I'm wondering... is there an event I can bind to that say after the
textbox (or entire ajax content) is attached to the browser DOM (or
after the content is attached to a parent), process the spinner?
$(function(){$(".spinner").spinner();}); doesn't work when placed
within the ajax content itself. it produces the same results as
calling spinner in the load event. the outerHeight/Width are 0.
On Dec 10, 6:29 am, "Richard D. Worth" <rdwo...@gmail.com> wrote:
> On Wed, Dec 9, 2009 at 4:52 PM, Jason Meckley <jasonmeck...@gmail.com>wrote:
>
>
>
> > it appears that calling load programatically (rather than clicking on
> > the tab manually) does not call the show function.
>
> In that case, you might try .triggerHandler('click')
>
> - Richard
