Search code examples
jqueryjquery-uijquery-tabs

select dynamic tab immediately upon new tab creation

demo : http://jsfiddle.net/axrwkr/ujUu2/

var num_tabs = $("div#tabs ul li").length + 1;

        $("div#tabs ul").append(
            "<li><a href='#tab" + num_tabs + "'>#" + num_tabs + "</a></li>"
        );
$("div#tabs").append(
            "<div id='tab" + num_tabs + "'>#" + num_tabs + "</div>"
        );
        $("div#tabs").tabs("refresh");

the new tabs syntax is so complicated (after 1.9 upgrade)..

one more question, 1.9 onward the remove method had been depreceated, so if I want to remove a particular tab, should I use remove() to remove the tab element and then the appended div (content)? that sound un-practical..

Solution

  • add this in the end of $("button#add-tab").click(function()

    DEMO

    $('a[href=#tab'+num_tabs+']').click(); //click new tab link to make it active

    or you can use active option

    DEMO

    $("div#tabs").tabs("refresh").tabs({ active:num_tabs - 1});