Kevin
Kevin

Reputation: 653

How to set "class = active" for second tab?

I have some tabs. In that sometimes first tab is "introduction" and sometimes "outline" is first tab. I have set introduction class=active when it comes first. But when outline comes first I am not getting how to set its class as active.

code is like below

<ul class="nav-tabs" role="tablist">
    <?php 
    $tabs = array();
    if(!$sessId == "" && !$checkcourse){
        $tabs = array("introduction"=>true, "outline"=>true,"announcement"=>false,"discussion"=>false,"review"=>true, "student"=>true, "comment"=>true); 
    } else if($sessId == "") {
        $tabs = array("introduction"=>true, "outline"=>true,"announcement"=>false,"discussion"=>false,"review"=>true, "student"=>false, "comment"=>true); 
    } else {
        $tabs = array("introduction"=>false, "outline"=>true,"announcement"=>true,"discussion"=>true,"review"=>true, "student"=>true, "comment"=>false); 
    }
    ?>                              

    <?php if($tabs['introduction']) { ?>
        <li class="active"><a href="#introduction" role="tab" data-toggle="tab">Introduction</a></li>
    <?php } ?>
    <?php if($tabs['outline']) { ?>
        <li><a href="#outline" role="tab" data-toggle="tab">Outline</a></li>
    <?php } ?>
    <?php if($tabs['review']) { ?>
        <li><a href="#review" role="tab" data-toggle="tab">Review</a></li>
    <?php } ?>
    <?php if($tabs['student']) { ?>
        <li><a href="#student" role="tab" data-toggle="tab">Student</a></li>
    <?php } ?>
    <?php if($tabs['comment']) { ?>
        <li><a href="#comment" role="tab" data-toggle="tab">Comment</a></li>
    <?php } ?>
    <?php if($tabs['announcement']) { ?>
        <li><a href="#announcement" role="tab" data-toggle="tab">Announcement</a></li>
    <?php } ?>
    <?php if($tabs['discussion']) { ?>
        <li><a href="#discussion" role="tab" data-toggle="tab">Discussion</a></li>
    <?php } ?>                  
</ul>

Upvotes: 0

Views: 764

Answers (1)

u_mulder
u_mulder

Reputation: 54831

Simple check with ternary operator is:

<?php if($tabs['outline']) {?>
    <li <?=$tabs['introduction']? '' : ' class="active"';?>><a href="#outline" role="tab" data-toggle="tab">Outline</a></li>
<?php } ?>

So you check if $tabs['introduction'] isset then you don't need class="active", else - add this class.

Update: But as first item of tab can change, I advise to create simple foreach:

$is_first = true;
foreach ($tabs as $tab_name => $value) {
    if ($value) {
        echo '<li' . ($is_first? ' class="active"' : '') . '><a href="#' . $tab_name . '" role="tab" data-toggle="tab">' . $tab_name . '</a></li>';
        $is_first = false;  // fix that we have first value here
    }
}

Here your main problem is how to link href value and caption.

Upvotes: 1

Related Questions