Jquery UI 1.9 tabs + jquery-ui-tabs-paging not working properly

Question

After adding many tabs the plugin crashes. I'm using some plugins to enhance the tables inside the panels in my app. I don't know why but when i add the 3rd tab int the 2nd page the plugin doesn't activates the last added tab and that makes that the table plugin crashes.

This is some of my code:

int port = 18000;
DatagramSocket serverSocket = new DatagramSocket(port);
byte[] receiveData = new byte[8];
System.out.println("Server Listing on Port: "+port);
String x;
while (true)
{
    DatagramPacket receivePacket = new DatagramPacket(receiveData, receiveData.length);
    serverSocket.receive(receivePacket);

function addSearchResult(title, content) {
    id = "tabs-" + tabId.toUpperCase(),
    li="<li><a href='#"+id+"'>"+title.toUpperCase()+"</a><span class='ui-icon ui-icon-close'></span></li>";
    tabs.find( ".ui-tabs-nav" ).append( li );
    tabs.append( "<div id='" + id + "'>" + content + "</div>" );
    tabs.tabs( "refresh" );
    $('#modal').trigger('close');
    tabs.tabs('option','active', $('#'+id).index()-1);
    indexTab++;
    $(".activo").find('.tablaQuotes, .tablaCuatro, .tablaCinco, .tablaSeis').dataTable({
        "aaSorting": [[1,'desc']]
    });
    $(".activo").find('.other').find('.tabui').dataTable({
        "aaSorting": [[2,'desc']],
        "iDisplayLength": 5
    });
    $(".activo").find('.gal').carouFredSel({
        circular:false,
        infinite:false
    });
    $(".activo").find(".grupo").colorbox({
        rel:'pt-'+tabId, transition:"none", width:"75%", height:"75%",
        onComplete:function(){
            $('#cboxLoadedContent').zoom();
        }
    });
}

And this is the code for the tabs:

var tabs = $( "#tabs" ).tabs({
    beforeActivate: function( event, ui ){
    },
    create: function( event, ui ){
    },
    activate: function( event, ui ){
        $('div').removeClass('activo');
        ui.newPanel.addClass('activo');
    }
});


$( "#tabs" ).tabs('paging');

twilson · Accepted Answer · 2012-12-31 14:53:08Z

1

Check the rendered HTML output and Javascript of the plugins you are using, as I found that the old "globalPanel" functionality no longer works in jQuery 1.9. All the content of tabs must be a descendant of the tab elements.

answered Dec 31, 2012 at 14:53

twilson

2,06214 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ricbermo · Accepted Answer · 2013-01-02 15:41:43Z

0

Well I've fixed it. i just add $('#tabs').tabs('pagingDestroy'); and $('#tabs').tabs('paging');

to destroy and initialize the plugin each time i add a new tab. I was doing this first but i was doing it in a wrong place ( inside beforeActivate() ), that why never worked. i just moved to addSearchResult();

answered Jan 2, 2013 at 15:41

Ricbermo

8051 gold badge6 silver badges28 bronze badges

Collectives™ on Stack Overflow

Jquery UI 1.9 tabs + jquery-ui-tabs-paging not working properly

This is some of my code:

And this is the code for the tabs:

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

This is some of my code:

And this is the code for the tabs:

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related