PHP $_SESSION array populated in one div and empty in another - php

Question

OK...i have something which makes no logical sense and I hope someone can point out the silly mistake I am making. I have a page in which i want the menus to change whether a user is logged in or not. I am using a session variable $_SESSION['is_logged_in] to store the logged in status. So for example, if logged out, the menu should say login. If logged in, the same menu should say logged out. Here is the code in logical pieces. I apologize in advance for all the code snippets but I want to be as clear as possible. Please help!
First, i have the main page called index.php which has some empty divs:
<div id="wrapper">
<div id="header">
<h1>My Page</h1>
<div id="navigation">
</div> <!-- end of navigation div -->
</div> <!-- end if header div -->
<p> </p>
<div id="mainContent">
</div><!-- end mainContent div -->
</div> <!-- end wrapper div -->
In this page (index.php), i have a jquery load of the navigation div on document ready:
<script type="text/javascript">
$(document).ready(function(e) {
//load the default menu
$('#navigation').load("menu.php");
});
</script>
OK...now menu.php has the following html/php:
<?php
session_start();
include 'php/functions.php';
//following is for debugging, you will see later where this is useful
if (is_logged_in())
{
echo "logged in value: " . is_logged_in() . "<br />";
print_r($_SESSION);
}
else
echo "not sure what is going on</br >";
echo "<br />";
?>
<ul id="menu" class="DropdownMenu">
<li class="sub">Account
<ul>
<?php
//this is where it should show one link or the other based on the value in $_SESSION
if (is_logged_in()) {
echo "<li>Log Out</li>\n";
} else {
echo "<li>Log In</li>\n";
}
?>
</ul>
</li>
</ul>
Ok...at this point, when the page loads, on top of the menu i see the debug message "not sure what is going on here" as expected because i am not logged in yet. Then I click on the Login link and via ajax, it populates the mainContent div in the index.php:
This is in menu.php:
$(document).ready(function(e) {
var options = {
target: '#mainContent', // target element(s) to be updated with server response
success: reloadMenu, // post-submit callback
delegation: true
};
// post-submit callback
function reloadMenu(responseText, statusText, xhr, $form) {
$('#navigation').load("menu.php");
};
//set the jquery form plugin for the login form
$('.ContentForm').ajaxForm(options);
//load the login form in the mainContent div
$('#wrapper').on("click", ".ClickLogin", function(e) {
$('#mainContent').load("login.php");
});
});
The above code shows that when the form is submitted, on success, the post submit callback should be re-loading the menu just like the initial load on the index.php document ready. With debugging, i do see that the it does reload it, but it never sees anything in the session variables so even though i am logged in, it still shows the Login link instead of log out.
Now, bringing it all together just to show i am not crazy, here is what is in the login.php:
<?php
// start the session
session_start();
include 'php/functions.php';
//this sections handles the post of the form
$show_form = true;
if($_SERVER['REQUEST_METHOD'] == "POST")
{
$email = $_POST['email'];
$password = $_POST['password'];
if (authenticate_user($email, $password)) //this will set $_SESSION variables
{
$show_form = false;
echo "Congratulations " . get_user_name() . ", you are logged in <br />";
//following is for debugging, you will see later where this is useful
if (is_logged_in())
{
echo "logged in value: " . is_logged_in() . "<br />";
print_r($_SESSION);
}
else
echo "not sure what is going on</br >";
}
else
{
echo "Invalid email or password. Try again <br />";
}
}
?>
<?php if ($show_form) { ?>
<div id="formContent">
<h2 class="ContentHeader">Log In</h2>
<form id="contentForm" name="registration" class="ContentForm" method="post" action=<?php echo $_SERVER['PHP_SELF']?>>
<p>
<label for="email">Email:</label>
<input type="email" name="email" id="email" required="required">
</p>
<p>
<label for="password">Password:</label>
<input type="password" name="password" id="password" required="required">
</p>
<p>
<input type="submit" name="insert" id="insertLink" value="Submit It" />
<input type="reset" name="cancel" id="cancel" value="Reset" />
</p>
<p>Forgot Password? Click here</p>
<p>Need to Register? Click <a class="ClickRegister" href="#">here</a></p>
</form>
I know it is a lot of code so i want to point out one thing. At this point, when the form is submitted, in the #navigation div, the menu.php is reloaded and in the #mainContent div, the login.php is reloaded. Both are executing this exact same code:
//following is for debugging, you will see later where this is useful
if (is_logged_in())
{
echo "logged in value: " . is_logged_in() . "<br />";
print_r($_SESSION);
}
else
echo "not sure what is going on</br >";
When the page displays after the login form submit, above the menu it says "not sure what is going on" followed by "Array()", however in the mainContent, it shows "logged in value: 1" and prints out all the session values.
Just for completeness, the is_logged_in() function looks like this:
//return true if the current session is logged in
function is_logged_in()
{
if (array_key_exists('is_logged_in', $_SESSION))
return $_SESSION['is_logged_in'];
}
I have session_start() in both menu.php and login.php, if i didn't it gives me all sorts of other errors when trying to access the $_SESSION array.
I really hope someone can spot my mistake. Please help!
Thanks in advance.

Answer 1

Answering the question officially for closure. As mentioned in the comments above, I was destroying the session prior to setting it as part of the login. I am still not sure why that had the effect it did since both divs were loaded after the destroy/re-create but maybe there is some ajax race condition.
I am just glad it is solved and I can move on. Thanks to all for your input.