Steve
Steve

Reputation: 3080

Adding jQuery tab and Going to Tab in IE8

I'm trying to dynamically add a extra jquery tab to the page and then go to that tab.

I am putting the new tab in just before the last tab (as in the real world example I am actually using the last tab as a button to create the new tab)

For some reason IE8 gets very confused and puts content into the new tab you create which is the html of all the tabs (titles, content etc)

http://jsfiddle.net/nSLfN/3/

any ideas why this might be happening?

Upvotes: 0

Views: 555

Answers (1)

Selvakumar Arumugam
Selvakumar Arumugam

Reputation: 79830

You should tabs add method to go to the newly added tab. Also you need to properly set the tab content href and the content. See below,

var $tabs = $('#tabs');
$tabs.tabs({
    tabTemplate: '<li><a href="#{href}">#{label}</a></li>',
    add: function( event, ui ) {
        $tabs.tabs( "option", "selected", ui.index );

        var tabCount = $tabs.tabs("length");
        $(ui.panel).append('<div id="#Delivery"'+ tabCount  +'>New Tab Content ' + tabCount  + '</p>');
    }
});

$('#addtab').click(function() {    
    var tabCount = $tabs.tabs("length");
    $tabs.tabs("add", "#Delivery" + tabCount, "Delivery " + tabCount, tabCount-1);
});

DEMO

Upvotes: 1

Related Questions