Page 1 of 1

Simple Solutions: Assigning 'Current' To Menu Item Easily Rate Topic: -----

#1 codeprada  Icon User is offline

  • Changed Man With Different Priorities
  • member icon

Reputation: 943
  • View blog
  • Posts: 2,353
  • Joined: 15-February 11

Posted 14 June 2011 - 08:16 PM

Scenario
It's wise to make a HTML file with a menu and simply include it on all your pages but what happens when you want to a particular menu item to be selected to indicate which page the user is on?

I've constantly seen coders using multiple IF statements which works also dirty and time wasting. If you're working with 20+ links then how long would it take to type every single IF statement....a very long time. Honestly I've been a victim of this. Recently I came up with a way of avoiding such a headache and still achieve your goal in just about 25 lines.

Solution
The trick is to get the HTML of our menu file and parse it while determining which page we're currently on. This can be determined by reading the href attribute of the links. Now you're thinking that not all links that lead to a page are actually menu links. That is correct, thus we will give each menu link a CLASS attribute of menu so we'll know what links to check. When we've ran into a menu link we'll compare its href attribute with the name of our script. If we've got a match then we'll set the ID attribute to current.

Sources
INDEX.PHP
<!DOCTYPE html>
<html>
<head>
	<title>Dynamic Menu - Home</title>
	<link type="text/css" rel="stylesheet" href="style.css" />
</head>
<body>
<?php include("d-menu.php"); ?>
</body>
</html>



STYLE.CSS
/* CSS Document */
.nav li{ display:inline; text-decoration:none }

.menu{ color:blue; }

#current{ color:white; background-color:blue }



MENU.HTML
<ul class="nav">
  <li><a class="menu" href="index.php">Home</a></li>
  <li><a class="menu" href="contact.php">Contact</a></li>
</ul>


D-MENU.PHP
<?php 
define('LINK_CLASS', 'menu');
define('CURRENT_ID', 'current');

$dom = new DOMDocument();
$dom->loadHTML(file_get_contents("menu.html")); //load $dom with the string returned from file_get_contents

$current_page = basename($_SERVER['SCRIPT_NAME']);

foreach($dom->getElementsByTagName('a') as $element)
{
	$class = &$element->attributes->getNamedItem('class')->nodeValue; //assign $class address of nodeValue instead of copying contents over to $class
	$href  = &$element->attributes->getNamedItem('href')->nodeValue;
	
	if($class == LINK_CLASS && $href == $current_page)	
		$element->setAttribute('id', CURRENT_ID);
}
echo $dom->saveHTML();
unset($dom);
?>

There are two ways in which I could have gotten the HTML of our menu.html file but file_get_contents is fast and straight to the point. Why store the string returned from file_get_contents when we aren't going to use it again? Take all of this into consideration when coding. Don't waste memory space.
Next we'll loop over each link {<a></a>} element and if its class name and href value is equal to constant LINK_CLASS and $current_page then we'll set the id attribute to current. The only thing left to do is echo our newly parsed HTML and free back up the memory.
pHp's job is done here and now the client's browser will parse the HTML and CSS to produce your webpage.

Is This A Good Question/Topic? 0
  • +

Page 1 of 1