Question

I have an unordered list that’s being generated from a database. Depending on the value of one of the returned fields, the li tag’s class should be set to different values. Unfortunately they’re all returning “inactive”. I know this must be something simple, but I’ve been staring at it for hours and am just not seeing it.

Here’s the code:

<ul class="tabs">
   <? foreach ($tracks AS $track) {
    $active = (strtolower($track->shortname === 'dpp')) ? ' class="active"' : 'class="inactive"';
    echo "<p>".strtolower($track->shortname). " is ".$active."</p>"; ?>
    <li <?= $active; ?>><a href="#<?= strtolower($track->shortname); ?>"><?= $track->name; ?></a></li>
   <? } ?>
</ul>

Here’s what is actually getting printed:

<ul class="tabs"> 
    <p>dpp is class="inactive"</p>  <li class="inactive"><a href="#dpp">Digital Path to Purchase</a></li> 
    <p>cre is class="inactive"</p>  <li class="inactive"><a href="#cre">Fueling Creativity</a></li> 
</ul> 

It’s obvious that the first one is returning $track-shortname of dpp, so why is the $active variable not getting set to “class=active”?

Answer 1

You’ve made an error in the expression where you check the shortname:

$active = (strtolower($track->shortname === 'dpp')) ? ' class="active"' : 'class="inactive"';
                     ^                           ^

You most certainly only want to put it around $track->shortname:

$active = (strtolower($track->shortname) === 'dpp') ? ' class="active"' : 'class="inactive"';
                     ^                 ^

Otherwise you tried to lowercase a boolean value which is either true or false but in your case it looks to always be false, hence the inactive CSS class.

BTW, you can spare another pair:

$active = strtolower($track->shortname) === 'dpp' ? ' class="active"' : 'class="inactive"';
         ^                                       ^