Asslaamu'alaikum para pengunjung....! Trik php kali ini akan membahas tentang bagaimana cara membuat form login dan logout dengan php yang di hibungkan ke database. Database (selanjutnya di singkat DB) yang saya pakai pada tutorial ini yaitu DB MySQL. sebelum kita memulai sesi ini kita harus membuat sebuah DB dengan nama members ( terserah anda mau di beri nama apa...? ) dan langkah-langka untuk membuat DB sebagai berikut :
Gambar tampilan depan Program MySQL
Lalu kemudian klik tombol ciptakan (saya menggunakan versi indonesia), setelah itu akan menuju halaman pembuatan tabel :
isikan di form nama dengan nama tabel dan number of field = 4 jumlah dari file tabel lalu klik tombol go. setelah di klik tombol go DB akan memasuki sesi memasukan data tampilan jadi nya seperti gambar di bawah ini:
Setelah selesai membuat DB, sesi selanjutnya membuat file konek_db dan login kita gabungkan menjadi satu dan scriptnya sebagai berikut:
<?php
session_start();
mysql_connect('localhost', 'root', '');
mysql_select_db('members');
$nama = $_POST['nama'];
$password = $_POST['pass'];
$query = "SELECT * FROM admin WHERE nama = '$nama'";
$hasil = mysql_query($query);
$data = mysql_fetch_array($hasil);
if ($password == $data['pass'])
{
$_SESSION['level'] = $data['level'];
$_SESSION['nama'] = $data['nama'];
include "admin/menu.php";
}
else echo "<h1>Login gagal</h1>";
?>
<html>
<a href="index.php">Ulangi...!</a>
</html>
simpan di program server yang anda pakai, kalo memakai apache simpan di C:/apache/htdocs sedangkan yang menggunakan xampp simpan di C:/xampp/htdocs. DB sudah, konek dan file login sudah sekarang tinggal membuat halaman depan nya. kita buat halaman depan dengan mengkolaborasikan antara html dan php scriptnya sebagai berikut:
<?php
if($_GET['login'])
{
include("log.php");
exit;
}
?>
<!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>
<link href="gambar/logo.png" rel="shortcut icon" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Elzam Accounting</title>
<style type="text/css">
<!--
.center {
text-align: center;
}
-->
</style>
</head>
<body>
<center><table width="864" border="0" cellspacing="1" cellpadding="0">
<tr>
<td><img src="gambar/baner.png" width="866" height="145" />
</td>
</tr>
<tr>
<td height="46">
<form id="form1" name="form1" method="post" action="index.php?login=success"><center><table width="200" border="0" cellspacing="2" cellpadding="2">
<tr>
<td colspan="3"><center>Masukkan Nama dan Password Disini...!</center></td>
</tr>
<tr>
<td width="63">Nama</td>
<td width="3">:</td>
<td width="114">
<label>
<input type="text" name="nama" id="nama" />
</label>
</td>
</tr>
<tr>
<td>Password</td>
<td>:</td>
<td>
<label>
<input type="PASSWORD" name="pass" id="pass" />
</label>
</td>
</tr>
<tr>
<td colspan="3"class="center">
<label>
<input type="submit" name="log" id="log" value="ENTER ->" />
</label>
</td>
</tr>
</table></center></form>
</td>
</tr>
</table>
</center>
</body>
</html>
Ok selesai sudah membuat login formnya.... dan cara menyimpannya sama seperti di awal. bagi yang males nulis scriptnya silahkan download disini
Lalu kemudian klik tombol ciptakan (saya menggunakan versi indonesia), setelah itu akan menuju halaman pembuatan tabel :
<?php
session_start();
mysql_connect('localhost', 'root', '');
mysql_select_db('members');
$nama = $_POST['nama'];
$password = $_POST['pass'];
$query = "SELECT * FROM admin WHERE nama = '$nama'";
$hasil = mysql_query($query);
$data = mysql_fetch_array($hasil);
if ($password == $data['pass'])
{
$_SESSION['level'] = $data['level'];
$_SESSION['nama'] = $data['nama'];
include "admin/menu.php";
}
else echo "<h1>Login gagal</h1>";
?>
<html>
<a href="index.php">Ulangi...!</a>
</html>
simpan di program server yang anda pakai, kalo memakai apache simpan di C:/apache/htdocs sedangkan yang menggunakan xampp simpan di C:/xampp/htdocs. DB sudah, konek dan file login sudah sekarang tinggal membuat halaman depan nya. kita buat halaman depan dengan mengkolaborasikan antara html dan php scriptnya sebagai berikut:
<?php
if($_GET['login'])
{
include("log.php");
exit;
}
?>
<!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>
<link href="gambar/logo.png" rel="shortcut icon" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Elzam Accounting</title>
<style type="text/css">
<!--
.center {
text-align: center;
}
-->
</style>
</head>
<body>
<center><table width="864" border="0" cellspacing="1" cellpadding="0">
<tr>
<td><img src="gambar/baner.png" width="866" height="145" />
</td>
</tr>
<tr>
<td height="46">
<form id="form1" name="form1" method="post" action="index.php?login=success"><center><table width="200" border="0" cellspacing="2" cellpadding="2">
<tr>
<td colspan="3"><center>Masukkan Nama dan Password Disini...!</center></td>
</tr>
<tr>
<td width="63">Nama</td>
<td width="3">:</td>
<td width="114">
<label>
<input type="text" name="nama" id="nama" />
</label>
</td>
</tr>
<tr>
<td>Password</td>
<td>:</td>
<td>
<label>
<input type="PASSWORD" name="pass" id="pass" />
</label>
</td>
</tr>
<tr>
<td colspan="3"class="center">
<label>
<input type="submit" name="log" id="log" value="ENTER ->" />
</label>
</td>
</tr>
</table></center></form>
</td>
</tr>
</table>
</center>
</body>
</html>
Ok selesai sudah membuat login formnya.... dan cara menyimpannya sama seperti di awal. bagi yang males nulis scriptnya silahkan download disini
mas...
ReplyDeletefile itu kita tulis dimana...
apa kita tulis di microsof afice word, lalu kta simpan di htdocs..
bener gak kek gitu mas..
Mas saya bingung lihat tutorialnya, soalnya kurang terstruktur. Dengan kata lain saya bingung yang mana dulu di tulis dan berikutnya apa.Berhasil si, tapi yang jadi indexnya yang mana ni mas.
ReplyDeleteirhaman: yang menjadi index yaitu adalah halaman depannya...
ReplyDeletetabelnya gk jadi trus gan..
ReplyDeletepak anonim mungkin ada yang salah dalam pembuatan databasenya...
ReplyDelete