Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Watch Video

Posted July 21, 2014 4:00am by

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

July 21, 2014 4:09am

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

July 21, 2014 4:19am

Erik Krieg i need you again my friend :)

July 21, 2014 4:39am

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

July 21, 2014 12:20pm

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

5 Answers

July 21, 2014 5:21am

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>

July 21, 2014 5:33am

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

July 21, 2014 5:52am

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 !

July 21, 2014 5:57am

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.

July 21, 2014 6:09am

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.

July 21, 2014 4:49am

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>

July 21, 2014 4:59am

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

July 21, 2014 5:02am

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

July 21, 2014 5:06am

<?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

July 21, 2014 5:09am

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

July 21, 2014 5:13am

<!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

July 21, 2014 5:37am

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

July 21, 2014 5:46am

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

Posting to the forum is only allowed for members with active accounts.
Please sign in or sign up to post.

Welcome to the Treehouse Community

Looking to learn something new?

Mohamed Mokhtar

Mohamed Mokhtar

variable issue

Mohamed Mokhtar

Mohamed Mokhtar

Mohamed Mokhtar

Mohamed Mokhtar

Mohamed Mokhtar

Mohamed Mokhtar

eck

eck

5 Answers

Jason Anello

Jason Anello

Mohamed Mokhtar

Mohamed Mokhtar

Mohamed Mokhtar

Mohamed Mokhtar

Jason Anello

Jason Anello

Jason Anello

Jason Anello

Jovanny Elias

Jovanny Elias

Mohamed Mokhtar

Mohamed Mokhtar

Jovanny Elias

Jovanny Elias

Mohamed Mokhtar

Mohamed Mokhtar

Jovanny Elias

Jovanny Elias

Mohamed Mokhtar

Mohamed Mokhtar

Jovanny Elias

Jovanny Elias

Mohamed Mokhtar

Mohamed Mokhtar