I am attempting to create a login page.
For now you simply click Login on the login.php page, it then sends a request to index.php which shows a message for a successful login and changes a variable loggedin
which is used in the session to see if user has logged in or not, then redirects to the home page.
Now my navigation bar (nav.php) checks the session variable loggedin
and will display contents accordingly i.e whether a user is logged in or not and if they can see the My profile link etc...
The problem is when the login page (login.php
) sends a request to index.php
for the logged in page it does a check like this:
index.php:
.row, .col { overflow: hidden; position: absolute; }
.row { left: 0; right: 0; }
...
.menu.row { height: 75px; top: 75px; background-color: #EDEDED; }
...
<div class="menu row">
<?php
include("nav.php"); ?>
</div>
...
case 'logged_in':
$_SESSION['loggedin'] = true;
print '<script type="text/javascript">';
print 'alert("You have been logged in successfully and will be re-directed to your homepage...")';
print '</script>';
include('home.html');
echo '<script type="text/javascript">$(".menu.row").load("index.php");</script>';
break;
as you can see the last echo statement attempts to update the menu row div class which contains nav.php
in order to reflect the changes from the session variable loggedin
being displayed but it only shows changes after I click another link on the nav.php
page.
So basically I'm asking why does my
echo '<script type="text/javascript">$(".menu.row").load("index.php");</script>';
doesn't refresh the div which contains my nav.php and thus allowing nav.php to execute the PHP code to check the variable loggedin
and act accordingly?
Here is some of the code:
index.php:
<?php session_start(); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CC Chat</title>
<meta
http-equiv="content-type" content="text/html; charset=utf-8"
/>
<!--
Thanks too http://stackoverflow.com/a/7851347/1133011 for the help
on layout which acts more like frames but avoids them and using divs. As frames have
known draw backs see here http://stackoverflow.com/questions/4600648/frames-with-php we
should thus rather use include in php
!-->
<style type="text/css" media="screen">
/* Generic pane rules */
body { margin: 0 }
.row, .col { overflow: hidden; position: absolute; }
.row { left: 0; right: 0; }
.col { top: 0; bottom: 0; }
.scroll-x { overflow-x: auto; }
.scroll-y { overflow-y: auto; }
.header.row { height: 75px; top: 0; background-color: #E5E5E5; }
.menu.row { height: 75px; top: 75px; background-color: #EDEDED; }
.body.row { top: 150px; bottom: 50px; background-color: #F5F5F5; }
.footer.row { height: 75px; bottom: 0; background-color: #EBEBEB; }
</style>
</head>
<body>
<div class="header row">
<?php include("header.html"); ?>
</div>
<div class="menu row">
<?php
include("nav.php"); ?>
</div>
<div class="body row scroll-y">
<?php
if(isset($_GET['page'])) {
switch ($_GET['page']) {
case 'login':
include('login.php');
break;
case 'logged_in':
$_SESSION['loggedin'] = true;
print '<script type="text/javascript">';
print 'alert("You have been logged in successfully and will be re-directed to your homepage...")';
print '</script>';
include('home.html');
echo '<script type="text/javascript">$(".menu.row").load("index.php");</script>';
break;
case 'log_out':
$_SESSION['loggedin'] = false;
include('loggedout.html');
break;
case 'profile':
include('profile.php');
break;
case 'contact_us':
include('contact.html');
break;
default:
include('home.html');
break;
}
} else
include('home.html');
?>
</div>
<div class="footer row">
<?php include("footer.php"); ?>
</div>
</body>
</html>
nav.php:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Navigator</title>
<meta
http-equiv="content-type"
content="text/html; charset=iso-8859-1"
/>
</head>
<body>
<p align="center">
<?php
if(isset($_SESSION['loggedin'])) {
switch ($_SESSION['loggedin']) {
case true:
echo "<a href=\"index.php?page=home\">Home</a> <a href=\"index.php?page=contact_us\">Contact Us</a> <a href=\"index.php?page=profile\">My profile</a> <a href=\"index.php?page=log_out\">Log out</a>";
break;
default:
echo "<a href=\"index.php?page=home\">Home</a> <a href=\"index.php?page=contact_us\">Contact Us</a> <a href=\"index.php?page=login\">Login</a>";
break;
}
} else {
echo "<a href=\"index.php?page=home\">Home</a> <a href=\"index.php?page=contact_us\">Contact Us</a> <a href=\"index.php?page=login\">Login</a>";
}
?>
</p>
</body>
</html>
login.php:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Login</title>
<meta http-equiv="content-type"
content="text/html; charset=iso-8859-1"
/>
</head>
<body>
<h2 align="center">Login</h2>
<p align="center">
<?php
$var=true;//user password was correct
if($var==true){
echo '<a href="index.php?page=logged_in">Login</a>';
} else {
print '<script type="text/javascript">';
print 'alert("Password is incorrect.")';
print '</script>';
}
?>
</p>
</body>
</html>