Handling Ajax events inside jQuery Tools for Tabs

Question

I want to handle Ajax events (like "success") in jQuery Tools (the tab module).
I have this code for the html:

<div class="wrap">
    <div class="pane">
        <ul class="tabs">
            <li><a href="1.php">Tab 1</a></li>
            <li><a href="2.php">Tab 2</a></li>
            <li><a href="3.php">Tab 3</a></li>
        </ul>   

        <div class="pane-ajax">
            <div class="ajax">
                <h3>just a test</h3>
                <div id="name">
                </div>
            </div>
        </div>
    </div>  
</div>

and this is the javascript:

$(function(){
    jQuery("ul.tabs").tabs("div.pane-ajax > .ajax", {effect: 'ajax'});      
});   

Where do I have to place the Ajax code management?

Answer 1

I found out how to achieve what I wanted by creating a custom effect:

jQuery.tools.tabs.addEffect("myAjax", function(index, done) {
    jQuery.ajax({
        context: this,
        url:'myUrl.php',
        data:{index:index},
        success: function(data){            
            this.getPanes().eq(0).html(data);
            done.call();
        },
        error: function(){
            console.log('error');               
        }
    });
});  
jQuery("ul.tabs").tabs("div.pane-ajax > div.ajax", {effect: 'myAjax',initialEffect:true});