Friday, June 29, 2018

Login Page


index.php file is the main file of a web base system or a website. It is called the index file because when we visit to the application, this is the first file loads in to the browser. In general practice, it says every site must have an index file. The name "index" or "default" is served as the index names in most web servers.

 In this system, index file (index.php) is considered as the login page to the system. To login to the system user need to enter a username and a password. Therefore we need to create a HTML form to enter these details. Following is the login form;

<form method="post" action="index.php">
<table border="0" align="center">
<tr><td>Username:</td><td><input type="text" size="30" name="user"></td></tr>
<tr><td>Password:</td><td><input type="password" size="30" name="pass"></td></tr>
<tr><td>&nbsp;</td><td><input type="submit" name="submit" value="Login"></td></tr>
  </table>
</form>

When user click on the login button, username and password submitted to the same page (index.php in the action tag). Then we need to handle the form submit in PHP script. We need to check in the users table for matching values.

<?php
if(isset($_POST['submit'])){
$user = $_POST['user'];
$pass = $_POST['pass'];
if($user != '' && $pass != ''){
$q = mysql_query("SELECT * FROM users WHERE User_Name = '$user' AND User_Password = '$pass'");
$r = mysql_fetch_assoc($q);
$db_username = $r['User_Name'];
$db_password = $r['User_Password'];
if($user === $db_username && $pass === $db_password){
// login
$_SESSION['login'] = date('YMd');
$_SESSION['user_id'] = $r['User_ID'];;
header("location: main.php");
ob_end_flush();
}else{
$error = "Incorrect Username and / or Password!";
}
}
}
?>

If matching values are found in the database, redirect the user to main.php file while setting login sessions. If user submitted data is not matching with database values, then displays an error message.

In the index.php file, we do not used, header.php and footer.php because of checking user login sessions. The complete source code of the index.php file as follows.

<?php session_start(); ?>
<?php ob_start(); ?>
<?php
if(isset($_SESSION['login']) && $_SESSION['login'] == date('YMd')){
header("Location: main.php");
ob_end_flush();
}
?>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>EasyTrade&trade; | Login</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
<?php include("db_connect.php"); ?>
<div class="main-wrapper">
<?php
if(isset($_POST['submit'])){
$user = $_POST['user'];
$pass = $_POST['pass'];
if($user != '' && $pass != ''){
$q = mysql_query("SELECT * FROM users WHERE User_Name = '$user' AND User_Password = '$pass'");
$r = mysql_fetch_assoc($q);
$db_username = $r['User_Name'];
$db_password = $r['User_Password'];
if($user === $db_username && $pass === $db_password){
// login
$_SESSION['login'] = date('YMd');
$_SESSION['user_id'] = $r['User_ID'];;
header("Location: main.php");
ob_end_flush();
}else{
$error = "Incorrect Username and / or Password!";
}
}
}
?>
<div style="width:30%; padding:5px; background-color:#FFFF00; border:3px solid #FFCC00; margin:150px auto;">
<?php
if(isset($error)){
echo "<div class='error'>{$error}</div>";
}
?>
<form method="post" action="index.php">
<table border="0" align="center">
<tr><td>Username:</td><td><input type="text" size="30" name="user"></td></tr>
<tr><td>Password:</td><td><input type="password" size="30" name="pass"></td></tr>
<tr><td>&nbsp;</td><td><input type="submit" name="submit" value="Login"></td></tr>
  </table>
</form>
</div>
</div>
</body>
</html>
<?php mysql_close($conn); ?>

We use inline css and well as css defined in the style.css file. In next chapter we discuss about the style sheets.
Share:

0 comments:

Post a Comment