Going Crazy: Please help JQuery Tabs

Going Crazy: Please help JQuery Tabs


Here is what I am trying to do:
1) I want to intercept the JQuery Ui.tabs select event and if the form
validation fails, cancel changing tabs.
I have looked at the document and I don't understand what I am doing wrong.
$(document).ready(function() {

$('#tabs-nav').tabs();
//never get the event, nothing ever happens
var $tabs = $('#tabs-nav').tabs({
select: function(e, ui) {
alert(ui.index === $tabs.data('selected.tabs'));
}
});
The select event NEVER fires, I've tried everything. If I reference the
object and assign a .click function I see an alert, so that works. I don't
understand what I am missing. I have tried using .bind (tabsselect) and
nothing ever seems to run when I change tabs.
This is the markup nothing special:
<div id="tabs-nav" style='width:700px'>
<ul>
<li> #fragment-1 About Me </li>
<li> #fragment-2 Contact </li>
</ul>
<div id="fragment-1">
.....stuff
<div id="fragment-2">
...stuff
etc
I don't understand what I am missing. Can some walk me through this. I
have downloaded the lastet Jquery source.
Thanks in advance.
--
View this message in context: http://www.nabble.com/Going-Crazy%3A-Please-help-JQuery-Tabs-tp20802255s27240p20802255.html
Sent from the jQuery UI Discussion mailing list archive at Nabble.com.