ITku

Membuat fom login dengan Php merupakan judul pertama dalam kategori Php di blog ini. Form login Php ini saya buat menggunakan XAMPP, Notepad ++, dan Chrome sebagai browser. Siapkan alat/senjata tersebut sebelum beraksi.

Pertama buatlah database dengan nama latihan1, berikut perintah sqlnya

CREATE DATABASE latihan1;

Setelah Database sukses dibuat kemudian ciptakan sebuah tabel dalam database tersebut dengan nama tb_user. Berikut perintah sqlnya

CREATE TABLE `latihan1`.`tb_user` (
`username` VARCHAR( 20 ) NOT NULL ,
`password` VARCHAR( 20 ) NOT NULL
) ENGINE = INNODB;

Kalau kesulitan dengan perintah sql diatas gunakan fasilitas di phpmyadmin. Isi tb_user dengan username dan password yang diinginkan, berikut perintah sqlnya

insert into tb_user (username, password) VALUE ('admin', '1234');

Setelah database dan table dibuat selanjutnya simpan code dibawah ini dengan nama index.php

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Login</title>
<style>
form {background:#3399FF;
position:relative;
margin-left:50px;
}
h2 {
font-family:"Courier New", Courier, monospace;
font-size:40px;
text-align:center;
color:#0033FF;
}
</style>
</head>
<body>
<h2> LOGIN USER SYSTEM </h2>
<div style="position: absolute;left: 31%;">
<form id="login" method="post" name="login" action="periksa.php">
<table width="286" border="0" cellpadding="2" cellspacing="2">
<tr bgcolor="#FF0000">
<td height="19" colspan="2" align="center" valign="middle">
<strong><font color="#FFFFFF"><blink>LOGIN DI SINI</blink></font></strong></td>
</tr>
<tr>
<td width="106" height="17"> </td>
<td width="180"> </td>
</tr>
<tr>
<td height="18" align="right" valign="middle"><div align="left">Username</div></td>
<td valign="middle">
<input name="username" type="text" id="username" size="20"></td>
</tr>
<tr>
<td height="18" align="right" valign="middle"><div align="left">Password</div></td>
<td valign="middle"><input name="password" type="password" id="password" size="20" /></td>
</tr>
<tr>
<td height="18" valign="top"> </td>
<td valign="middle">
<input name="login" type="submit" id="login" value=" Login ">
<input type="reset" name="Reset" value="Batal / Clear" /></td>
</tr>
<tr bgcolor="#FF0000">
<td height="18" colspan="2" valign="top"> </td>
</tr>
</table>
</form>
</div>
</body>
</html>

Kalau tampilannya kurang sreg bisa diotak-atik pada cssnya. Lanjut ke kode proses loginnya.

<?php
session_start();
#**************** koneksi ke mysql *****************#
$host = "localhost";
$user = "root";
$pass = "";
$dbname ="latihan1";
$conn = mysql_connect($host,$user,$pass);
if($conn) {
//select database
$sele = mysql_select_db($dbname);
if(!$sele) {
echo mysql_error();
}
}
#***************** akhir koneksi ******************#
#jika ditekan tombol login
if(isset($_POST['login'])) {
$username = $_POST['username'];
$password = $_POST['password'];
$sql = mysql_query("SELECT * FROM tb_user WHERE username='$username' &&
password='$password'");
$num = mysql_num_rows($sql);
if($num==1) {
// login benar //
$_SESSION['user'] = $username;
$_SESSION['passwd'] = $password;
?><script language="JavaScript">alert('Selamat, Login Anda Sukses!!');
document.location='formdatasiswa.php'</script><?
} else {
// jika login salah //
echo "<script>
eval(\"parent.location='index.php '\");
alert (' Maaf Login Gagal, Silahkan Isi Username dan Password Anda Dengan Benar');
</script>";
//include("login.php");
}
}
?>

Simpan kode diatas dengan nama proses.php. Oia jangan lupa ubah user dan pass sesuai yang ada pada localhost Anda.

Simpan semua file diatas dalam satu folder dan letakkan di C:\xampp\htdocs.

ITku

MENU

Selasa, 09 April 2013

1 komentar: