Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

PHP Build a Simple PHP Application Creating the Menu and Footer Adding Active States to the Navigation

variable issue

when was following along with this video , when it came to the part for making variables to run into the conditional statements on each Li of the menu , i made a variable with the name $section just like the course applying ... but it did not work for me and i ended with a missed up design , when i opened chrome developer tool to inspect it , i found an error with "undefined variable section " i double checked the code again and everything was right ... so i tried to assign a new variable name other than section , and it worked just fine ... i wonder why i had this error with the specific variable name of $section

now a new issue appeared , this conditional statement should add a class that styles the link with underline if it is the active page my code for the list items is

<li class="shirts <?php if ($underLine == "shirts") { echo "on"; } ?>"><a href="shirts.php">Shirts</a></li>
<li class="contact <?php if ($underLine == "contact") { echo "on"; } ?>"><a href="contact.php">Contact</a></li>

now i always have the two links underlined , and when i go to any of the pages the underline disappear from the other page's link .... this is really confusing

Erik Krieg i need you again my friend :)

to be more clear i inspected the 2nd issue again and i am still getting the same error "undefined variable" and in the console i am getting "uncaught syntaxerror: unexpected token :" with this link (chrome-extension://kchdfagjljmhgapoonapmfngpadcjkhk/js/jquery-1.11.0.min.map) i wounder why i am getting this jquery link ... i dont have any js or jquery included

Erik Krieg
Erik Krieg
43,038 Points

Sorry! I was sleeping. Looks like things were handled though :P

5 Answers

Hi Mohamed,

You're seeing these unintended styles on the home page correct? When you used $section you should have been seeing a white background on the "shirts" link and both links underlined. Then when switching to the other variable name you probably would only see both links underlined.

This is because the $section variable is undefined on the index page. This is the notice error that you are seeing in dev tools. You should be seeing that error right inside the class attribute for the list items. This means each part of the message is being interpreted by the browser as a class name. Using dev tools you'll be able to see what css selectors end up matching.

The solution I used is to first check if the variable is set first before trying to use it.

<li class="shirts<?php if ( isset($section) && $section == "shirts") { echo " on"; } ?>"><a href="shirts.php">Shirts</a></li>
<li class="contact<?php if ( isset($section) && $section == "contact") { echo " on"; } ?>"><a href="contact.php">Contact</a></li>

absolutely correct !! you have described exactly what i have seen ! cheers !! this worked but i got two more question if you may , first i did not understand the explanation of why this happened exactly , so bare with me and explain again please second why when randy used the code in the video he didn't face the same issue

i can understand from the other post link Jovanny just posted what have you meant by why this problem happened , but what still a mystery to me why this did not happen to Randy Hoyt during the video :) .... or we just wait till he sees this tag :) ... again thanks a lot for your help !

The link Jovanny posted explains a little.

I didn't re-watch the video but I think we don't see the problem because Randy never navigates back to the index page after adding those scripts. I think he only goes to the "shirts" and "contact" pages to show they're correctly underlined.

It happens on the index page because you didn't set the $section variable to anything on that page because you weren't using it. But the scripts in the navigation will still run on the index page. PHP outputs a notice to warn you that you're using a variable that hasn't been defined.

This doesn't happen on the other two pages because you're defining the variable like this $section = "shirts"

Now you could fix the problem simply by setting the $section variable equal to something on the index page just to avoid the error.

$section = "home" You could do that on your index page but then it's something you have to always remember to do.

I would recommend using isset() whenever you have a variable that isn't always going to be used.

You're welcome.

I think the problem was discovered after shooting the video. If I remember right, I think the project files do contain the $section = "home" fix. So maybe the project files were updated afterwards.

It would probably help a lot to add a Teacher's Notes section below this video with a solution.

Your variable for section looks to be correct, just remember to change the shirts to value to contact on the contact html page and same goes if you add any other pages.

<?php
$section =  "shirts";
?>

The reason your variable is not working is because you are not using it when you made your if statement. Remember you created the variable called section and in the if statement you have a variable that you never created underline. Simple replace that with the variable section and it should work. It will also work if you change your variable name to underline instead of section. This should fix the issue if not let me know and I can take another look but for now this is the only error I see.

<li class="shirts <?php if ($section == "shirts") { echo "on"; } ?>"><a href="shirts.php">Shirts</a></li>
<li class="contact <?php if ($section == "contact") { echo "on"; } ?>"><a href="contact.php">Contact</a></li>

no i made sure i changed the variables on shirts.php , contact.php and in the if statement on header.php ... variables were matching on both times i tried it ether $section or $underLine

Can you post all your html code for the shirts page. Here or on codepen. I can take a look and see what might be wrong

<?php 
$pageTitle = "Mike's Full Catalog Of Shirts";
$underLine = "shirts";
include('header.php'); ?>


    <div class="section page">
        <h1>Mike&rsquo;s Full Catalog Of Shirts</h1>
    </div>

<?php include('footer.php'); ?>

and same goes for contact page with different values for the variables

This looks fine the issue might be in your header.php file can you post that one too

<!DOCTYPE html>
<html>
<head>
    <title><?php echo $pageTitle; ?></title>
    <link rel="stylesheet" href="css/style.css" type="text/css">
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Oswald:400,700" type="text/css">
    <link rel="shortcut icon" href="favicon.ico">
</head>
<body>

    <div class="header">

        <div class="wrapper">

            <h1 class="branding-title"><a href="./">Shirts 4 Mike</a></h1>

            <ul class="nav">
                <li class="shirts <?php if ($underLine == "shirts") { echo "on"; } ?>"><a href="shirts.php">Shirts</a></li>
                <li class="contact <?php if ($underLine == "contact") { echo "on"; } ?>"><a href="contact.php">Contact</a></li>
                <li class="cart"><a href="#">Shopping Cart</a></li>
            </ul>

        </div>

    </div>

    <div id="content">

by the way the pageTitle variable working just fine across all pages , this is why i am confused with the other variable not working

I found another post that will solve your problem. Too bad someone beat me to it. Lol anyways it's here if you want to read it

https://teamtreehouse.com/forum/stage-2-active-states-css-help

yeah and that same someone just helped me too :) , thanks for your help too you guys are amazing community :) !