jQuery simulate click on tab with code execution

Question

The code below, when I click on a tab, I do a post and display the result in the tab. In some case, I'd like force the selected tab, but not only select the tab but select the tab + execute the code executed when I click on it.

In my exemple, I like select the second tab (jLikeToSet = 1) and execute the code :

$.post('/Home/e2', function (data) {
        $('#tabs-2').html(data);
});

jQuery :

    var $tabs = $("#tabs").tabs();
    var jLikeToSet = 1
    $("#tabs").bind('tabsselect', function (event, ui) {
        switch (ui.index) {
            case 0:
                $.post('/Home/e1', function (data) {
                    $('#tabs-1').html(data);
                });
                break;
            case 1:
                $.post('/Home/e2', function (data) {
                    $('#tabs-2').html(data);
                });
                break;
            case 2:
                $.post('/Home/e3', function (data) {
                    $('#tabs-3').html(data);
                });
                break;
        }
    });

HTML:

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Screen 1</a></li>
        <li><a href="#tabs-2">Screen 2</a></li>
        <li><a href="#tabs-3">Screen 3</a></li>
    </ul>
    <div id="tabs-1"></div>
    <div id="tabs-2"></div>
    <div id="tabs-3"></div>
</div>

How can I do this ?

Thanks,

Update1 : I tried to use this code : $('#tabs').tabsClick(1); but no work, sample come from here http://www.eduteka.org/ajax/tabs3/

Answer 1

To select programmatically a tab, call this function with jLikeToSet arg:

function selectTab(jLikeToSet){
    $("#tabs").tabs( "select" , jLikeToSet);
}

when this function is executed, it's as if you have selected manually, so what's inside .bind('tabsselect' will be executed.