Jump to content

How Do I Insert An Attribute Into A Specific Element?


Fluoresce

Recommended Posts

I have a list menu like this:

 

<ul>
<li><a class="active" href="page.php?id=1">Lorem Ipsum</a></li>
<li><a href="page.php?id=2">Lorem Ipsum</a></li>
<li><a href="page.php?id=3">Lorem Ipsum</a></li>
<li><a href="page.php?id=4">Lorem Ipsum</a></li>
</ul>

 

How do I get the class attribute (class="active") to be inserted into the right <li> element without using loads of if/else statements?

 

In other words, if someone clicks the third link, how do I get the class attribute to be inserted into the third <li> element when the visitor lands on page.php?id=3 without using if/else?

 

Any help will be much appreciated.

Something like this should do the trick.

 

 

<ul>
<li><a<?php echo isset($_GET['id'] && $_GET['id'] == 1) ? " class='active'" : "";?> href="page.php?id=1">Lorem Ipsum</a></li>
<li><a<?php echo isset($_GET['id'] && $_GET['id'] == 2) ? " class='active'" : "";?> href="page.php?id=2">Lorem Ipsum</a></li>
<li><a<?php echo isset($_GET['id'] && $_GET['id'] == 3) ? " class='active'" : "";?> href="page.php?id=3">Lorem Ipsum</a></li>
<li><a<?php echo isset($_GET['id'] && $_GET['id'] == 4) ? " class='active'" : "";?> href="page.php?id=4">Lorem Ipsum</a></li>
</ul>

In order to cut down the repeated code, I'd do something like this:

<?php// Define variables for later use.
$active = array ();

// Check if page has been selected.
if (isset ($_GET['id']) {
   // If it has, retrieve it's ID and add the active class to it's associated link.
   $page = (int) $_GET['id'];
   $active[$page] = ' class="active"');
}


?>
<ul>
   <li><a<?php echo !isset ($active[1]) ?: $active[1]); ?> href="page.php?id=1">Lorem ipsum</a></li>
   <li><a<?php echo !isset ($active[2]) ?: $active[2]); ?> href="page.php?id=2">Lorem ipsum</a></li>
   <li><a<?php echo !isset ($active[3]) ?: $active[3]); ?> href="page.php?id=3">Lorem ipsum</a></li>
   <li><a<?php echo !isset ($active[4]) ?: $active[4]); ?> href="page.php?id=4">Lorem ipsum</a></li>
</ul>

 

Might even create the menu with a loop, to further condense it. Especially if there were more lines, and they all followed the same pattern. Then I'd end up with something like this:

// Define variables for later use.
$menu = '';

// Check if page has been selected, and retrieve the ID.
if (!isset ($_GET['id'] || !$page = (int) $_GET['id']) {
   // Couldn't find the ID, or it was not a number, set default to 1.
   $page = 1;
}

// Define the menu item template for sprintf ().
$menuTemplate = "\t".'<li><a%3$s href="page.php?id=%1$d">%2$s</a></li>'."\n"

// Loop through the array containing the details on the link to the pages.
foreach ($pages as $id => $text) {
   // If the current page has been selected, mark it as active.
   $ap = ($id == $page) ? ' class="active"' : ''; 

   // Add the current page to the menu, making sure to protect ourselves against HTML injection attacks.
   $menu .= sprintf ($menuTemplate, $id, htmlspecialchars ($text, ENT_QUOTES, 'UTF-8'), $ap);
}

// Finalize the menu.
$menu "<ul>\n{$menu}</ul>\n";

 

This will allow you to easier change the menu, especially if you have a few more items, or if it changes frequently. It'll also allow you to save the links somewhere else, as for example in a database, and it'll make it easier to support multiple languages.

What method is best to use, however, is something you'll have to decide on a case-by-case basis. :)

<?php

$page  = isset($_GET['id']) ? $_GET['id'] : 1;
$pages = array("Lorem Ipsum", "Lorem Ipsum", "Lorem Ipsum", "Lorem Ipsum");

$count = count($pages);
for ($i = 1; $i <= $count; $i++)
{
   echo "<li><a href='page.php?id={$i}'" . ($page == $i ? " class='active'" : "") . ">" . $pages[$i - 1] . "</a></li>\n";
}

?>

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.