views:

33

answers:

1

I'm using tabs from jquery ui.

When the page loads and if the first tab is empty, I would like the second tab to get selected. and if the second tab is empty, then the third tab gets selected etc.

This is what I have and it works, but is there a cleaner/better way to do it?

$('#tabs').tabs( { selected: 0 } );
var fullTab = 0;
if ($('#tab0 > .no-results').length != 0) 
{
   $('#tabs').tabs( { selected: 1 } );
} else {
fullTab = 1;
}

if ($('#tab1 > .no-results').length != 0  && fullTab == 0) 
{
    $('#tabs').tabs( { selected: 2 } );
} else {
fullTab = 1;
}

if ($('#tab2 > .no-results').length != 0 && fullTab == 0) 
{
    $('#tabs').tabs( { selected: 3 } );
} else {
fullTab = 1;
}

if ($('#tab3 > .no-results').length != 0 && fullTab == 0) 
{
    $('#tabs').tabs( { selected: 0 } );
} else {
fullTab = 1;
}
A: 

Simple for loop.

$('#tabs').tabs( { selected: 0 } ); 
var fullTab = 0; 
var maxTab = 3;
for(i=0;i<=maxTab;i++){
    if ($('#tab' + i + ' > .no-results').length != 0)  
    { 
       $('#tabs').tabs( { selected: (i==maxTab)?0:i+1 } ); 
    } else { 
    fullTab = 1; 
    } 
}
smdrager
Thanks for the quick response
OfficeHax