I create a TabStrip something like this, where "#myStrip" is set up to have a bunch of tabs, all loaded with Ajax. After it is initialized, I immediately call select() to set the default tab
widget = $(
// contentUrls set up here, etc.
// widget.activateTab(3); // doesn't help?
retval = widget.select(3);
selected = widget.select();
With the Ajax loading, I think the sequence is:
- My code makes the widget.select(3) call
- "select" event fires
- tabstrip retrieves ajax content for tab index=3
- the content is inserted, and a script in the content is executed, tries to do a select() on the tabbar
- "contentLoad" event fires
- "activate" event fires
My problem is that during (3), a script on the ajax-loaded content wants to check what tab is selected. It does something like $('#myStrip').data('kendoTabStrip').select(), but the select() getter doesn't actually return anything (0-length jquery object). My guess is that the initial select(...) setter in (2) hasn't actually finalized setting whatever internal variable it stores the current tab info in. It only does that sometime between (4) and (5), and for anything that calls select() before that, like my ajax content initializing at (4), the widget doesn't return what will be the tab element shortly.
I tried using "activateTab()" instead to avoid triggering the "select" event, but select() still doesn't seem to return anything until after the contentLoad/activate events have fired. I could probably have the ajax-content stash a function that does what I want, and have a contentLoad handler call that function so that select() would be valid by that point, but I'd like to avoid that if possible. Do I have to assume that it is not legit to do select() during the content loading process, before it has finished and fired "contentLoad"?
I tried to modify the ajax demo as an example, but there wasn't an easy way to provide my own custom ajax tab content with a script that called select().