Posted by Jagoan Degol | Posted in | Posted on 11.11
Hasil akhir dari form yang saya buat adalah buat adalah seperti berikut :
Sebelum menggunakan modul ini, di dalam komputer yang
akan digunakan harus terinstal aplikasi-aplikasi pendukung untuk membuat
website. Disini saya menggunakan Macromedia Dreamweaver untuk membuat
script PHP dan XAMPP untuk membuat databasenya serta Mozilla Firefox
sebagai web browsernya.
Dalam modul ini akan saya bahas tentang :
v
Cara membuat database
v
Cara membuat halaman utama
website
v
Cara menghubungkan website
dengan database
v
Cara menampilkan database
dalam halaman web browser
1.
Cara membuat
database
Sebelum membuat database, langkah pertama yang harus
dilakukan adalah membuat struktur folder :
-
Buka windows explorer lalu
pilih folder xampp
-
Double klik folder htdocs
-
Didalam folder htdocs buat
folder baru (disini saya buat folder dengan nama spmb)
Setelah itu kita membuat database dengan langkah-langkah seperti berikut
:
-
Buka Mozilla Firefox
-
Pada address bar ketik http://localhost/phpmyadmin/
-
Maka akan terbuka halaman
utama XAMPP
-
Selanjutnya klik database
di sudut kiri atas
-
Beri nama database pada
kolom Buat basis data (saya buat nama databsenya spmb)
-
-
Selanjutnya klik Buat
-
Setelah nama database
berhasil dibuat, selanjutnya kita buat tabel dalam database tersebut
-
Isi dalam tabel yang saya buat sepeti
berikut ini :
Nama
|
Jenis
|
Panjang / Nilai
|
Ekstra
|
Id
|
Integer
|
3
|
AUTO_INCREMENT
|
Nama
|
Char
|
45
|
|
Alamat
|
Varchar
|
100
|
|
Tgl_lahir
|
Date
|
||
Jenis_kelamin
|
Enum(‘Laki-laki’,’Perempuan’,”,”)
|
||
Prodi_pilihan
|
Varchar
|
45
|
-
Setelah selesai tinggal
klik tombol kirim di sudut kanan bawah
2.
Cara membuat halaman
utama website
Ketikkan Script berikut pada Macromedia Dreamweaver, lalu
simpan dengan nama index.php lalu simpan dalam folder spmb.
<html>
<head>
<title>spmb</title>
</head>
<body>
<h1 div
align="center">FORMULIR SPMB</h1>
<div align="center">
<?php
//Script untuk menampilkan pesan ketika
berhasil menambah data
if (!empty($_GET['message']) && $_GET['message']
== 'success') {
echo '<h3>Berhasil menambah data!</h3>';
}
?>
<form name="formulir"
action="insert.php" method="post">
<table width="500"
align="center" cellpadding="5" cellspacing="5"
border="0" bgcolor="#CCCCCC">
<tr>
<td>Nama</td>
<td>:</td>
<td><input
name="nama" type="text" id="nama"
size="40" maxlength="50"
required="required"/></td>
</tr>
<tr>
<td>Alamat</td>
<td>:</td>
<td><textarea
name="alamat" cols="30" rows="5"
id="alamat"
required="required"></textarea></td>
</tr>
<tr>
<td>Tanggal
Lahir</td>
<td>:</td>
<td><select
name="tgl" size="1" id="tgl">
<?php
for
($i=1;$i<=31;$i++)
{
echo
"<option
value=".$i.">".$i."</option>";
}
?>
</select>
<select
name="bln" size="1" id="bln">
<?php
$bulan=array("","Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","November","Desember");
for
($i=1;$i<=12;$i++)
{
echo
"<option
value=".$i.">".$bulan[$i]."</option>";
}
?>
</select>
<select
name="thn" size="1" id="thn">
<?php
for
($i=1945;$i<=2000;$i++)
{
echo
"<option
value=".$i.">".$i."</option>";
}
?>
</select>
</td>
</tr>
<tr>
<td>Jenis
Kelamin</td>
<td>:</td>
<td><input
name="jenis_kelamin" type="radio"
value="Laki-laki" required="required"
>Laki-Laki
<input
name="jenis_kelamin" type="radio"
value="Perempuan" required="required"
>Perempuan
</td>
</tr>
<tr>
<td>Prodi
Pilihan</td>
<td>:</td>
<td><select
name="prodi_pilihan">
<option>TIK</option>
<option>PAI</option>
<option>Bahasa
Inggris</option>
<option>Bahasa
Arab</option>
<option>PGMI</option>
<option>BK</option>
</select></td>
</tr>
<tr>
<td
colspan="3" align="center">
<input
name="simpan" type="submit" id="simpan"
value="Simpan">
<a
href="tampil.php"><input type="submit"
name="lihat" value="Lihat Data"></a>
</td>
</tr>
</table>
</form>
</body>
</html>
3.
Cara menghubungkan
website
Ketikkan kode berikut pada Macromedia
Dreamweaver lalu simpan dengan nama koneksi.php lalu simpan dalam folder
spmb
<?php
$host='localhost';
$name='root';
$pass='';
$dbname='spmb';
$connect=mysql_connect($host,$name,$pass)or
die(mysql_error());
$dbselect=mysql_select_db($dbname);
?>
4.
Cara memasukkan data
kedalam database
Ketikkan kode berikut pada Macromedia Dreamweaver lalu simpan
dengan nama insert.php lalu simpan dalam folder spmb
<?php
include('koneksi.php');
$nama=$_POST['nama'];
$alamat=$_POST['alamat'];
$tgl_lahir=$_POST['thn']."-".$_POST['bln']."-".$_POST['tgl'];
$jenis_kelamin=$_POST['jenis_kelamin'];
$prodi_pilihan=$_POST['prodi_pilihan'];
$query=mysql_query("insert into spmb Values('','$nama','$alamat','$tgl_lahir','$jenis_kelamin','$prodi_pilihan')")
or die (mysql_error());
if ($query){
header('location:index.php?message=success');
}
?>
5.
Cara menampilkan
data dalam halaman web browser
Ketikkan kode berikut pada Macromedia Dreamweaver lalu simpan
dengan nama tampil.php lalu simpan dalam folder spmb
<?php
include('koneksi.php');
?>
<html>
<head>
<title>Tampil data SPMB</title>
</head>
<body>
<h1 align="center">Tampil
Data SPMB</h1>
<table width="850"
border="1" align="center" cellpadding="5"
cellspacing="0">
<thead>
<tr>
<td width="10" align="center"
bgcolor="#FFFFFF">No.</td>
<td width="190" align="center"
bgcolor="#FFFFFF">NAMA</td>
<td width="250" align="center"
bgcolor="#FFFFFF">ALAMAT</td>
<td width="100" align="center"
bgcolor="#FFFFFF">TGL LAHIR</td>
<td width="150" align="center"
bgcolor="#FFFFFF">JENIS KELAMIN</td>
<td width="150" align="center"
bgcolor="#FFFFFF">PRODI PILIHAN</td>
</tr>
</thead>
<tbody>
<?php
$query = mysql_query("select * from spmb");
$no
= 1;
while ($data = mysql_fetch_array($query)) {
?>
<tr>
<td width="10" align="center"><?php echo
$no; ?></td>
<td width="190" align="center"><?php echo
$data['nama']; ?></td>
<td width="250" align="center"><?php echo
$data['alamat']; ?></td>
<td width="100" align="center"><?php echo
$data['tgl_lahir']; ?></td>
<td width="150" align="center"><?php echo
$data['jenis_kelamin']; ?></td>
<td width="150" align="center"><?php echo
$data['prodi_pilihan']; ?></td>
</tr>
<?php
$no++;
}
?>
</tbody>
</table><br>
<div align="center"><a
href="index.php"><input type="button" value="+
Tambah Data"</a></div><br>
</body>
</html>
Selesai sudah formulir pendaftaran pada website yang
kita buat. Untuk menjalankannya ketik di address bar pada Mozilla Firefox http://localhost/spmb/ maka secara otomatis
akan terbuka halaman index.php.
Silahkan coba inputkan data, kalau data itu berhasil
di masukkan dalam database maka akan muncul teks “Berhasil Menambah Data!”.
Silahkan klik tombol “Tampil Data” untuk melihat hasil
data yang di input tadi.
makasih gan udah berbagi ilmunya,bermanfaat banget :D semoga berkah amin :D
gan nama tabel nya itu apa?
dan di script yang mana gan untuk nyisipkan nama tabel nya ?
mohon penjelasanya gan..
ga ada sql databasenya mohon , di ralat lagi blognya...