1. Buat new file php beri nama Form.php dan simpan pada folder htdocs/PraktikunPHP21. dan berikut script yg telah saya buat.
Script :
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" type="text/css" href="button.css" /> <title>Formulir</title> </head> <body style="background-image:url(blue.jpg); background-repeat:repeat;"> <form action="action.php" name="form1" method="post"> <table cellspacing="0" cellpadding="4" bgcolor="#FFFFFF" border="1" width="650" height="200" Style='border-radius:20px;border-color:white; position:fixed;left:360px;top:90px; box-shadow: 0 0 5px 5px black;'> <tr> <td rowspan="12" width="250" Style=' border-top-left-radius:20px;border-bottom-left-radius:20px '><center><img src="logo.jpg" width="200" 0height="200" /></center></td> <td colspan="3" bgcolor="#0066FF" Style=' border-top-right-radius:20px; '> <center><strong><font color="white">INPUTAN BIODATA</font></strong></center> </td> </tr> <tr> <td> Nama Lengkap </td> <td width="1"><center>:</center></td> <td><input type='text' name="nama" size="27"></td> </tr> <tr> <td> Jenis Kelamin</td> <td><center>:</center></td> <td> Laki-Laki<input type="radio" value="L" name="gender"/> Perempuan<input type="radio" value="P" name="gender"/> </td> </tr> <tr> <td>Tempat Lahir</td> <td><center>:</center></td> <td><input type='text' name="tempat" size="27"></td> </tr> <tr> <td>Tanggal Lahir</td> <td><center>:</center></td> <td> <?php $bulan=array("Januari" ,"Februari", " Maret" ,"April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember"); echo '<select name="hari">'; $hari=1; while($hari<=31) { echo "<option value='$hari'>$hari</option>"; $hari++; } echo '</select>'; echo '<select name="bulan">'; $jumlah=count($bulan); for($i=0; $i<$jumlah ; $i++){ echo '<option value="'.$bulan[$i].'">'.$bulan[$i].'</option>'; } echo '</select>'; echo '<select name="tahun">'; for($tahun=1995; $tahun<2010; $tahun++){ echo "<option value='$tahun'>$tahun</option>"; } echo '</option>'; ?> </td> </tr> <tr> <td>Alamat</td> <td><center>:</center></td> <td><input type='text' name="alamat" size="27"></td> </tr> <tr> <td>Asal SMP</td> <td><center>:</center></td> <td><input type='text' name="smp" size="27"></td> </tr> <tr> <td>Agama</td> <td><center>:</center></td> <td><select name="agama" > <option>Islam</option> <option>Kristen</option> <option>Katolik</option> <option>Budha</option> <option>Hindu</option> </select> </td> </tr> <tr> <td>Cita - Cita</td> <td><center>:</center></td> <td><input type='text' name="cita2" size="27"></td> </tr> <tr> <td>Hobi</td> <td><center>:</center></td> <td><input type='text' name="hobi" size="27"></td> </tr> <tr> <td>Foto</td> <td><center>:</center></td> <td> <input name="foto" type="file" /> </td> </tr> <tr> <td colspan="3" Style=' border-bottom-right-radius:20px;'><center><button type="reset" value="Refresh" ONCLICK="history.go(0)"> Reset </button> <button type="submit" name="submit"> Kirim </button></center> </td> </tr> </table> </form> </body> </html>
2. Kemudian saya akan membuat action.php untuk menampilkan resuman inputan dari form.php.
oke langsung saja. Berikut scriptnya.
Script :
<link rel="stylesheet" type="text/css" href="button.css" /> <title>Hasil</title> <body style="background-image:url(blue.jpg); background-repeat:repeat;"> <?php $nama=$_REQUEST['nama']; $gender=isset($_REQUEST['gender'])?$_REQUEST['gender']:""; $tempat=$_REQUEST['tempat']; $hari=$_REQUEST['hari']; $bulan=$_REQUEST['bulan']; $tahun=$_REQUEST['tahun']; $alamat=$_REQUEST['alamat']; $smp=$_REQUEST['smp']; $cita2=$_REQUEST['cita2']; $agama=$_REQUEST['agama']; $hobi=$_REQUEST['hobi']; $foto=isset($_REQUEST['foto'])?$_REQUEST['foto']:""; if($nama=="" || $gender=="" || $tempat=="" || $hari=="" || $bulan=="" || $tahun=="" || $alamat=="" || $smp=="" || $cita2=="" || $agama=="" || $hobi=="" || $foto=="") { echo'<h1><center>Maaf, Data Kurang Lengkap</center></h1>'; echo'<form action="form.php" method="post"><center><button type="submit" name="submit"> Kembali & Lengkapi </button></center></form>'; } else { if($gender=='L'){ echo'<h2><center>Selamat Datang Saudara, '.$nama.'<br>Berikut Biodatamu</center></h2>';} else{ echo'<h2><center>Selamat Datang Saudari, '.$nama.'<br>Berikut Biodatamu</center></h2>'; } print(" <table cellspacing='0' cellpadding='4' bgcolor='#FFFFFF' border='1' width='650' height='200' Style='border-radius:20px;border-color:white; position:fixed;left:360px;top:110px;box-shadow: 0 0 5px 5px black; '> <tr> <td colspan='4' bgcolor='#0066FF' Style=' border-top-left-radius:20px; border-top-right-radius:20px'> <center><strong><font color='white'><div class='Da'>DATA DIRI</div></font></strong></center> </td> </tr> <tr> <td> Nama Lengkap </td> <td width='1'><center>:</center></td> <td> $nama</td> <td rowspan='9' width='200' Style=' border-bottom-right-radius:20px'><center><img src='$foto' width='150' height='200' /></center> </td> </tr> <tr> <td> Jenis Kelamin</td> <td><center>:</center></td> <td> $gender </td> </tr> <tr> <td>Tempat Lahir</td> <td><center>:</center></td> <td>$tempat</td> </tr> <tr> <td>Tanggal Lahir</td> <td><center>:</center></td> <td> $hari, $bulan $tahun</td> </tr> <tr> <td>Alamat</td> <td><center>:</center></td> <td> $alamat</td> </tr> <tr> <td>Asal SMP</td> <td><center>:</center></td> <td>$smp</td> </tr> <tr> <td>Agama</td> <td><center>:</center></td> <td> $agama</td> </tr> <tr> <td>Cita - Cita</td> <td><center>:</center></td> <td>$cita2</td> </tr> <tr> <td Style=' border-bottom-left-radius:20px'>Hobi</td> <td><center>:</center></td> <td>$hobi</td> </tr> </table> "); } ?>
jgn lupa disave 1 folder yg sama dengan form.php tadi.
Sekarang kita coba hasilnya..
1. Run form.php pada browser.
2. Isi semua inputan yang ada lalu tekan button kirim
3. Maka akan muncul resume-man inputan melalui action.php.
4. Untuk tambahan, apabila saya saat meninputkan data kurang lengkap.. maka akan muncul tampilan seperti ini.
Sekian tutorial singkat dari saya.. Semoga bermanfaat....
0 Comments