Question posted in 
I want to hide login and sign up box and button after user login. I have tried but it won’t work. Here are my codes
header.php
<!DOCTYPE HTML>
<html>
<head>
<title>My Play a Entertainment Category Flat Bootstrap Responsive Website Template | Home :: w3layouts</title>
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- bootstrap -->
<link href="css/bootstrap.min.css" rel='stylesheet' type='text/css' media="all" />
<!-- //bootstrap -->
<link href="css/dashboard.css" rel="stylesheet">
<!-- Custom Theme files -->
<link href="css/style.css" rel='stylesheet' type='text/css' media="all" />
<script src="js/jquery-1.11.1.min.js"></script>
<!--start-smoth-scrolling-->
</head>
<body>
<?php
session_start();
if(!isset($_SESSION["sess_email"])){
?>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><h1><img src="images/logo.png" alt="" /></h1></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<div class="top-search">
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
<input type="submit" value=" ">
</form>
</div>
<div class="header-top-right">
<div class="file">
<a href="upload.html">Upload</a>
</div>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><h1><img src="images/logo.png" alt="" /></h1></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<div class="top-search">
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
<input type="submit" value=" ">
</form>
</div>
<div class="header-top-right">
<div class="file">
<a href="upload.html">Upload</a>
</div>
<div class="signin">
<a href="#small-dialog2" class="play-icon popup-with-zoom-anim">Sign Up</a>
<!-- pop-up-box -->
<script type="text/javascript" src="js/modernizr.custom.min.js"></script>
<link href="css/popuo-box.css" rel="stylesheet" type="text/css" media="all" />
<script src="js/jquery.magnific-popup.js" type="text/javascript"></script>
<!--//pop-up-box -->
<div id="small-dialog2" class="mfp-hide">
<h3>Create Account</h3>
<div class="social-sits">
<div class="facebook-button">
<a href="#">Connect with Facebook</a>
</div>
<div class="chrome-button">
<a href="#">Connect with Google</a>
</div>
<div class="button-bottom">
<p>Already have an account? <a href="#small-dialog" class="play-icon popup-with-zoom-anim">Login</a></p>
</div>
</div>
<div class="signup">
<form action="addnewuser.php" " method="post">
<input type="text" name="username" class="email" placeholder="username" autocomplete="off"/>
<input type="text" name="email" class="email" placeholder="Email" required="required" pattern="([w-.]+@([w-]+.)+[w-]{2,4})?" title="Enter a valid email"/>
<input type="password" name="password" required="required" pattern=".{6,}" title="Minimum 6 characters required" autocomplete="off"/>
<input type="text" name="mnumber" class="email" placeholder="Mobile Number" maxlength="10" pattern="[1-9]{1}d{9}" title="Enter a valid mobile number" />
<br><input type="radio" name="gender" value="male" checked> Male<br>
<input type="radio" name="gender" value="female"> Female<br>
<input type="radio" name="gender" value="other"> Other
<br>
<input type="submit" value="Signup" name="submit" />
</form>
</div>
<div class="clearfix"> </div>
</div>
<script>
$(document).ready(function() {
$('.popup-with-zoom-anim').magnificPopup({
type: 'inline',
fixedContentPos: false,
fixedBgPos: true,
overflowY: 'auto',
closeBtnInside: true,
preloader: false,
midClick: true,
removalDelay: 300,
mainClass: 'my-mfp-zoom-in'
});
});
</script>
</div>
<div class="signin">
<a href="#small-dialog" class="play-icon popup-with-zoom-anim">Sign In</a>
<div id="small-dialog" class="mfp-hide">
<h3>Login</h3>
<div class="social-sits">
<div class="facebook-button">
<a href="#">Connect with Facebook</a>
</div>
<div class="chrome-button">
<a href="#">Connect with Google</a>
</div>
<div class="button-bottom">
<p>New account? <a href="#small-dialog2" class="play-icon popup-with-zoom-anim">Signup</a></p>
</div>
</div>
<div class="signup">
<form action="login1.php" method="post">
<input type="text" name="email" class="email" placeholder="Email" required="required" pattern="([w-.]+@([w-]+.)+[w-]{2,4})?" title="Enter a valid email"/>
<input type="password" name="password" required="required" pattern=".{6,}" title="Minimum 6 characters required" autocomplete="off"/>
<input type="submit" value="Login" name="submit" />
</form>
<div class="forgot">
<a href="#">Forgot password ?</a>
</div>
</div>
<div class="clearfix"> </div>
</div>
</div>
<div class="clearfix"> </div>
</div>
</div>
<div class="clearfix"> </div>
</div>
</nav>
<?php } else { ?>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><h1><img src="images/logo.png" alt="" /></h1></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<div class="top-search">
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
<input type="submit" value=" ">
</form>
</div>
<div class="header-top-right">
<div class="file">
<a href="upload.html">Upload</a>
</div>
<?=$_SESSION['sess_email'];?><a href="logout.php" title="Logout">Logout</a>
<?php
}
?>
index.php
<?php include 'includes/header.php';?>
<!-- /header -->
<div class="col-sm-3 col-md-2 sidebar">
<div class="top-navigation">
<div class="t-menu">MENU</div>
<div class="t-img">
<img src="images/lines.png" alt="" />
</div>
<div class="clearfix"> </div>
</div>
<div class="drop-navigation drop-navigation">
<ul class="nav nav-sidebar">
<li class="active"><a href="index.html" class="home-icon"><span class="glyphicon glyphicon-home" aria-hidden="true"></span>Home</a></li>
<li><a href="shows.html" class="user-icon"><span class="glyphicon glyphicon-home glyphicon-blackboard" aria-hidden="true"></span>TV Shows</a></li>
<li><a href="history.html" class="sub-icon"><span class="glyphicon glyphicon-home glyphicon-hourglass" aria-hidden="true"></span>History</a></li>
<li><a href="#" class="menu1"><span class="glyphicon glyphicon-film" aria-hidden="true"></span>Movies<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span></a></li>
<ul class="cl-effect-2">
<li><a href="movies.html">English</a></li>
<li><a href="movies.html">Chinese</a></li>
<li><a href="movies.html">Hindi</a></li>
</ul>
<!-- script-for-menu -->
<script>
$( "li a.menu1" ).click(function() {
$( "ul.cl-effect-2" ).slideToggle( 300, function() {
// Animation complete.
});
});
</script>
<li><a href="#" class="menu"><span class="glyphicon glyphicon-film glyphicon-king" aria-hidden="true"></span>Sports<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span></a></li>
<ul class="cl-effect-1">
<li><a href="sports.html">Football</a></li>
<li><a href="sports.html">Cricket</a></li>
<li><a href="sports.html">Tennis</a></li>
<li><a href="sports.html">Shattil</a></li>
</ul>
<!-- script-for-menu -->
<script>
$( "li a.menu" ).click(function() {
$( "ul.cl-effect-1" ).slideToggle( 300, function() {
// Animation complete.
});
});
</script>
<li><a href="movies.html" class="song-icon"><span class="glyphicon glyphicon-music" aria-hidden="true"></span>Songs</a></li>
<li><a href="news.html" class="news-icon"><span class="glyphicon glyphicon-envelope" aria-hidden="true"></span>News</a></li>
</ul>
<!-- script-for-menu -->
<script>
$( ".top-navigation" ).click(function() {
$( ".drop-navigation" ).slideToggle( 300, function() {
// Animation complete.
});
});
</script>
<div class="side-bottom">
<div class="side-bottom-icons">
<ul class="nav2">
<li><a href="#" class="facebook"> </a></li>
<li><a href="#" class="facebook twitter"> </a></li>
<li><a href="#" class="facebook chrome"> </a></li>
<li><a href="#" class="facebook dribbble"> </a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<?php include 'includes/footer.php';?>
login.php
<?php
if(isset($_POST["submit"])){
if(!empty($_POST['email']) && !empty($_POST['password'])) {
$email=$_POST['email'];
$password=$_POST['password'];
$con=mysql_connect('localhost','root','') or die(mysql_error());
mysql_select_db('site1') or die("cannot select DB");
$query=mysql_query("SELECT * FROM user WHERE email='".$email."' AND password='".$password."'");
$numrows=mysql_num_rows($query);
if($numrows!=0)
{
while($row=mysql_fetch_assoc($query))
{
$dbemail=$row['email'];
$dbpassword=$row['password'];
}
if($email == $dbemail && $password == $dbpassword)
{
session_start();
$_SESSION['sess_email']=$email;
/* Redirect browser */
header("Location: index.php");
}
} else {
echo "Invalid email or password!";
}
} else {
echo "All fields are required!";
}
}
?>
3
Answers
There is something with your
session_start(). These need to be on top of each file you are using the session handler. If you don’t putsession_start()on top, the headers won’t be sent to the browser.So your files would look like:
Header.php
Login.php
In headers.php check if $_SESSION[‘sess_email’] variable is not empty. If empty then display the login button.
start at the top of your page with
then at login.php you , again, start with
at the top of your page
then create a if statement:
then create a jQuery function like this:
or in javascript