JQuery UI Tabs activate event is not firing

Question

var activeTab = $('#tabs ul li[name=<%= this.activeTab %>]');
var activeTabIndex = activeTab.length > 0 ? activeTab.index() : 0;
$("#tabs").tabs({
  selected: activeTabIndex,
  create: function (e, ui) {
    alert('create!');
    console.log("create!");
  },
  activate: function (e, ui) {
    alert('here!');
    console.log("test");
  }
});

The activeTab variable is meant to activate the same tab after POST (it works). The create event is firing as expected. But the activate event is not, and I don't understand why. I'm obviously missing something.

I'm using the following for documentation:

http://api.jqueryui.com/tabs/

Small skeleton of the tabs div.

<div id="tabs">
  <ul>
  <li name="Admin"><a href="#admin-tab">Admin</a></li>
  </ul>
</div>

Answer 1

Determine what version of jQuery UI you are using. Since you are using 1.8, you must use show instead. See the jQuery UI 1.8 docs.