A few things before
we go further:
You’ll need to have XAMPP Control Panel installed and Apache
running on port 80 if you’re using Windows. MySQL server should also be
running. If you’re using Skype, I recommend you halt its usage while working on
this since its using the same port as Apache.
HTML code for the
login page
login.html
<html>
<head>
</head>
<form name="login" method="post"
action="connect.php">
Username: <input type="text"
name="username" /><br />
Password: <input type="password"
name="password" />
<input type="submit"
value="Login">
</form>
</html>
Just copy and paste this block of code on your notepad, save in html format and
run it. I recommend you use the same file names as I did; the same goes for the
PHP coding.
PHP Coding to connect
the MySQL server
connect.php
<?php
$connect=mysql_connect("localhost","root","password");
mysql_select_db("database_name",$connect)
or
die
(mysql_error().":<b> ".mysql_error()."</b>");
$username = $_POST['username'];
$password = $_POST['password'];
$username =
mysql_real_escape_string($username);
$password = mysql_real_escape_string($password);
$sql =
"SELECT * FROM table_name WHERE username='$username' and
password='$password'";
$result = mysql_query($sql);
$count = mysql_num_rows($result);
if($count == 1)
{
print"<script
language='javascript'>alert('Welcome!');</script>";
require('nextpage.html');
}
else
{
print"<script
language='javascript'>alert('Username or Password
Incorrect!');</script>";
require('login.html');
die
(mysql_error().":<b> ".mysql_error()."</b>");
}
?>
A few tweaks to work on:
You should create a database and have its name replace
wherever the code says ‘database_name’ and also create a table in the database to
replace ‘table_name’ on the code. The column names used should be the same as
the ones used on the code.
The ‘$_POST’ variable names are the names given to the
variables on the login page.
There’s however a pitfall on the code, there’s no
‘nextpage.html’ created to display whenever the user logs in, so you will have
to create a page that will display and replace ‘nextpage.hmtl’.
I’ve also incorporated the use of JavaScript to alert
whenever the login details are correct or otherwise.
Warning!
I’ve seen a lot of people struggle with launching the form
pages on the XAMPP to run them on their localhost. All the pages you’re working
on should be saved in the xampp sub-folder called htdocs that is located on
most computers in drive C. So, for the login page above just have:
localhost/login.html as your address.
Your browser should display a webpage similar to this one.
Just comment for any queries or anything. Have fun coding!
No comments:
Post a Comment