ui.tabs: load event does not work as expected

[foomaster]

Hi there,

the ui.tab property of the load event does not seem to work.

Expected to work:

  load: function(e, ui) {
    ui.tab.find("span").html("Test");
  }

but the content of the tab remains unchanged.

This works (the tabs DIV has id="tabs"):

  load: function() {
    $("#tabs .ui-tabs-loading span").html("Test 2");
  }

HTML:

  <div id="tabs">
    <ul>
      <li><a href="some/URL"><span>Tab 1</span></a></li>
      <li><a href="other/URL"><span>Tab 2</span></a></li>
    </ul>
  </div>

Seems the tab property is not initialized properly.

Foomaster

[Scott González]

This works fine for me: ​http://jsbin.com/apevov/edit

[foomaster]

Replying to scott.gonzalez:

This works fine for me: ​http://jsbin.com/apevov/edit

Hmm, this works:

load: function(e, ui) {
    $(ui.tab).find("span").html("Test");
}

So ui.tab is not jQuery'd...

[Scott González]

You're probably not turning off the back compat layer, so you're getting the 1.8 API. You need to have $.uiBackCompat = false; after you load jQuery, but before you load jQuery UI (see the jsbin example).

[foomaster]

Thanks, that's the solution!