Aerdia Blog | Luapan Inspirasi dan Emosi

Praktikum PHP 6 : Validasi Form

Selasa, 03 Desember 2013

Asalammuallaikum Wr. Wb. Pada kesempatan kali ini saya akan post bagaimana penggunaan captcha, dan bagaimana membuat validasi form. Mari kita praktekkan.

Masuk ke IDE favorit anda, saya menggunakan Adobe Dreamweaver CS6.
Siapkan background untuk captcha. Dengan dimensi 60x30 pixel atau sesuai selera anda. Di bawah ini adalah yang akan saya gunakan. (123.jpg)
Buat file captcha.php untuk script captcha anda di validasi form. Berikut source code-nya. <?php session_start(); $alphaNumeric = "ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890"; $random = substr(str_shuffle($alphaNumeric), 0, 5); $image = imagecreatefromjpeg("123.jpg"); $textColor = imagecolorallocate($image, 0, 0, 0); imagestring ($image, 5, 5, 8, $random, $textColor); $_SESSION['image_random_value'] = md5($random); header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT"); header("Cache-Control : no-store, no-cache, must-revalidate"); header("Cache-Control: post-check=0, pre-check=0",false); header("Pragma: no-cache"); header('Content-type: image/jpeg'); imagejpeg($image); imagedestroy($image); ?>
Lalu buat file tugas.php untuk membuat input form validasi. Berikut source code-nya.

<!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" />
<title>PHP6</title>
<style type="text/css">
td {
	border:0;
}
table {
	border-radius:20px;
	background-color:white;
}
body {
	background-image:url(item.jpg);
}
</style>
</head>
<body>
<?php
 session_start();
 if(isset($_SESSION['error'])){
	 $error = $_SESSION['error'];
	 $_POST = $_SESSION['post'];
	 unset($_SESSION['error']);
	 unset($_SESSION['post']);
 }if(empty($nama) || empty($email) || empty($alamat) || empty($hp) || empty($password) || empty($gender) || empty($tempat) || empty($hari) || empty($bulan) || empty($tahun) || empty($pin)){?>
<form name="form1" method="post" action="tugasa.php">
<center>
<table width="779" border="9">
<tr>
    <td width="183" rowspan="10"><img src="logotelkom.jpg" width="183" height="179" /></td>
    <td colspan="3" bgcolor="#0099FF"><center>
Inputan Biodata</center>
</td>
  </tr>
<tr>
    <td width="118">Nama Lengkap</td>
    <td width="3">:</td>
    <td width="517"><input name="nama" placeholder="MASUKKAN NAMA" id="nama" type="text" value="<?php echo isset($_POST['nama']) ? $_POST['nama'] : '';?>"> <font color="#FF0000"><?php echo isset($error['nama']) ? $error ['nama'] :"";?></font></td>
  </tr>
<tr>
    <td>Jenis Kelamin</td>
    <td>:</td>
    <td><input name="gender" type="radio" value="Pria" <?php echo isset($_POST['gender'])? $_POST['gender']=='Pria' ? 'checked' : "":'';?> />
L
<input name="gender" type="radio" value="Wanita" <?php echo isset($_POST['gender'])? $_POST['gender']=='Wanita' ? 'checked' : "":'';?> />
P <font color="#FF0000"><?php echo isset($error['gender']) ? $error ['gender'] : "";?></font></td>
  </tr>
<tr>
    <td>TTL</td>
    <td>:</td>
    <td><input name="tempat" type="text" id="tempat2" placeholder="TEMPAT LAHIR" value="<?php echo isset($_POST['tempat']) ? $_POST['tempat'] : '';?>">,<select name="hari">
    <option value=hari>Hari</option>
    <?php
	$hari=1;
	$day = isset($_POST['hari']) ? $_POST['hari'] : "hari";
	while($hari<32){
		echo "<option value=$hari";
		echo $hari == $day ? " selected" : "";
		echo '>'.$hari.'</option>';
		$hari++;
	}
	?>
    </select>
    
<select name="bulan">
<option value="bulan">Bulan</option>
<?php
$bulan = array("Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","November","Desember");
$jumlah=count($bulan);
$month = isset($_POST['bulan']) ? $_POST['bulan'] : "bulan";
for($i=0; $i<$jumlah; $i++){
	echo "<option value=$bulan[$i]";
	echo $bulan[$i] == $month ? " selected" : "";
	echo '>'.$bulan[$i].'</option>' ;
}
    ?></select>
    
    <select name="tahun">
    <option value=tahun>Tahun</option>
    <?php
	$year = isset($_POST['tahun']) ? $_POST['tahun'] : "tahun";
	for($tahun=1995; $tahun<2015; $tahun++){
	echo "<option value='$tahun'";
	echo $tahun == $year? " selected" : "";
	echo '>'.$tahun.'</option>';
	}
	
	?>
    </select>
    
    <font color="#FF0000"><?php echo isset($error['tempat']) ? $error ['tempat'] :"";?></font></td>
  </tr>
<tr>
    <td>Email</td>
    <td>:</td>
    <td><input name="email" placeholder="EMAIL" id="email" type="text" value="<?php echo isset($_POST['email']) ? $_POST['email'] : '';?>" /><font color="#FF0000"><?php echo isset($error['email']) ? $error ['email'] : "";?></font></td>
  </tr>
<tr>
    <td>Password</td>
    <td>:</td>
    <td><input name="password" placeholder="PASSWORD" type="password" id="password2" value="<?php echo isset($_POST['password']) ? $_POST['password'] : '';?>" /><font color="#FF0000"><?php echo isset($error['password']) ? $error ['password'] : "";?></font></td>
  </tr>
<tr>
    <td>Alamat</td>
    <td>:</td>
    <td><input name="alamat" placeholder="ALAMAT" id="alamat2" type="text" value="<?php echo isset($_POST['alamat']) ? $_POST['alamat'] : '';?>" /><font color="#FF0000"><?php echo isset($error['alamat']) ? $error ['alamat'] : "";?></font></td>
  </tr>
<tr>
    <td>No.HP</td>
    <td>:</td>
    <td><input name="hp" placeholder="NOMOR HP" type="text" id="hp2" value="<?php echo isset($_POST['hp']) ? $_POST['hp'] : '';?>" /><font color="#FF0000"><?php echo isset($error['hp']) ? $error ['hp'] : "";?></font></td>
  </tr>
<tr>
    <td>Inputkan Captcha<img src="captcha.php?date=<?php echo date('YmdHis'); ?>" alt="security image(gak muncul)" /></td>
    <td>:</td>
    <td> <input type="text" placeholder="CAPTCHA" name="pin" value="<?php echo isset($_POST['pin']) ? $_POST['pin'] : '';?>" /><font color="#FF0000"><?php echo isset($error['pin']) ? $error ['pin'] : "";?></font></td>
  </tr>
<tr>
    <td colspan="3"><center>
<input type="Submit" name="Submit" value="Submit" class="button" style="background-color:#0099FF; border-radius:20px"  /></center>
</td>
  </tr>
</table>
</form>
<?php } ?> </center>
</body>
</html>

Kemudian buat file tugasa.php untuk membuat output form validasi. Berikut source code-nya.

//output
}
?>

Jalankan tugas.php, dan berikut hasilnya

Jika tombol Submitdi klik, dan data sudah terisi lengkap, maka akan tampil seperti :

Dan jika data tidak di isi lengkap, atau sama sekali akan terjadi error ketika di klik tombol submit seperti ini.

Sekian, terima kasih, semoga bermanfaat, dan salam hangat :)

Praktikum PHP 5

Jumat, 04 Oktober 2013

Asalammuallaikum Wr. Wb. Pada kesempatan kali ini saya akan post tentang Array, Fungsi, Modularisasi. Untuk penjelasan lebih lanjut anda dapat mendownload di blog guru saya tercinta, Bapak Hadi Wijaya, di sini. Langsung saja, kita praktekkan.

Masuk ke IDE favorit anda, saya menggunakan Adobe Dreamweaver CS6.
Buat new file lalu save dengan ekstensi *.php. Beri nama ModulHeader.php .Lalu masukan source code di bawah ini.

Lalu buat lagi file bernama ModulFooter.php. Berikut source code-nya. <!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" /> <title>Untitled Document</title> </head> <body> <center> <br /> ========================================= <br /> ©AERDIA™ 2013|21 <br /> ========================================= <br /> </center> </body> </html>
Jangan lupa buat juga file *.css untuk memperhalus tampilannya. Berikut sourcee code css yang saya gunakan.

body{
    background: url("bg.jpg") repeat;
    
}

@keyframes flow {
  0% {background-position: 0 0;}
  100% {background-position: 0 50%;}
 
}
#hw{
 font-family:Broadway;
 font-style:oblique;
 font-weight:200;
 font-size:44px;
 -moz-animation: muncul 2s ease-in-out;
 color:#039;
 }
table{
   margin: 20px auto;
   border-radius: 10px;
   -moz-animation: bayang 1s infinite;
   background-color:  #fff;
   border-color:#003;
   border-style: solid;
   border-width: 3px;
   padding: 0px 0px;
   -moz-animation: muncul 2s ease-in-out;
   opacity:0.7;

}

table img{
 position:relative;
 opacity:0;
}
#foto {
    opacity: 1;
    position: absolute;
    right: 340px;
    top: 200px;
}
#foto img{
 border-radius:10px;
}
@keyframes muncul{
    0%{opacity:0;}
100%{opacity:100;}
}

td{
    border-radius: 10px;
    border:0;
    font-weight:bold;
    position: inherit;
 padding:10px;
    
}
select{
    
    width: 70px;
    border-radius: 10px;
    
    font-weight: bold;
    -moz-transition: all 1s ease-in-out;
    
}
#keptap{
    color:#fff;
    background-color: blue;
    border-radius: 10px 10px 0px 00px;
}

select:focus{
 
    width: 100px;
    border-radius: 10px;
    
    font-weight: bold;
    -moz-transition: all 1s ease-in-out;  
}
#submit,a{
    position: relative;
   border-style: solid;
   border-radius: 10px;
   border-width: 1px;
    padding: 10px 15px;
    font-weight: bold;
    opacity: 80%;
 background-color: blue;
    color:rgba(255,255,255,7);
    -moz-transition: all 5s ease-in-out;
   margin: 10px 78px;

}

textArea{
    
   
    width: 100px;
     -moz-transition-duration:  1s;
}
#inputtext{
    border-radius: 10px;
   padding: 5px 8px;
     background-color: #fff;
    width: 100px;
        -moz-transition-duration:  1s;
        background-color: #fff;
        
        
}

#inputtext:focus,textArea:focus{
   border-radius: 10px;
     background-color: #fff;
     opacity: 80%;
     color:#666;
     font-weight: bold;
    padding: 5px 8px;
    width: 240px;
    -moz-transition-duration:  1s;
   
}

Kemudian buat TestModul.php untuk menggabungkan ModulHeader.php, ModulFooter.php, PHP_2.php, serta style.css.Dan berikut source code-nya. <?php require("file:///E:/XAMPP/htdocs/PraktikumPHP212RPL3/ModulHeader.php"); require("file:///E:/XAMPP/htdocs/PraktikumPHP212RPL3/PHP_2.php"); tulistebal("<center> <span id='hw'>Kami Punya Semboyan :</span></center> "); echo "<br>"; echo "<center> $kalimat</center> "; require("file:///E:/XAMPP/htdocs/PraktikumPHP212RPL3/ModulFooter.php"); ?>
Jalankan TestModul.php. Dan begini hasilnya, selamat berkreasi :).

Praktikum PHP 4

Sabtu, 14 September 2013

Asalammuallaikum Wr. Wb. Setelah PHP 2, mari kita langsung loncat ke Praktikum PHP 4, tentang Conditional, Array & Perulangan di PHP. Tanpa basa - basi lagi, mari kita segera praktekkan.

Masuk ke IDE favorit anda, saya menggunakan Adobe Dreamweaver CS6.
Buat new file lalu save dengan ekstensi *.php. Lalu masukan source code di bawah ini.

<!DOCTYPE html>
<head>
<title>Praktikum PHP #4</title>
    	<link rel="stylesheet" href="style2.css">
      </head>
<body>
<form action="script.php" method="post" >
<table border="0">
<tr>
    <td>Nama</td>
    <td>:</td>
    <td><input name="nama" type="text" id="nama" /></td>
  </tr>
<tr>
    <td>Email</td>
    <td>:</td>
    <td><input name="email" type="text" id="email" /></td>
  </tr>
<tr>
  	<td>Tempat Lahir</td>
    <td> : </td>
    <td>
    	<input name="tempatlahir" type="text" id="tempatlahir" /></td>
  </tr>
<tr>
  	<td>Tanggal Lahir</td>
    <td> : </td>
    <td>
<?php
//membuat array bulan
$bulan=array("Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","November","Desember");
//membuat combobox
echo"<select name='hari'>";
$hari=1;
while($hari<=31){
	echo"<option value=\"$hari\">$hari</option>";
	$hari++;
}
echo'</select>';

//membuat combobox bulan
echo "<select name='bulan'>";
$jumlah=count($bulan);
for($i=0; $i<$jumlah ; $i++){
	echo '<option value="'.$bulan[$i].'">'.$bulan[$i].'</option>';
}
echo "</select>";

//membuat combo box tahun
echo '<select name="tahun">';
for($tahun=1945; $tahun<2005; $tahun++){
	echo "<option value=\"$tahun\">$tahun</option>";
}
echo '</select>';
?></td>
  </tr>
<tr>
    <td>Jenis Kelamin</td>
    <td>:</td>
   <td> <span id="jk"><input type="radio" name="gender" value="L" />Laki - Laki
    <input type="radio" name="gender" value="P" />Perempuan</span>
    </td>
  </tr>
<tr>
    <td>Umur</td>
    <td>:</td>
    <td>
    <select name="umur">
    <option value="0-29">Di Bawah 30</option>
    <option value="30-60">Antara 30 sd 60</option>
    <option value="60+">Di Atas 60</option>
    </select>
    </td>
  </tr>
<tr>
    <td>Komentar</td>
    <td>:</td>
    <td><textarea name="komentar" cols="30" rows="4">
<br />
<br />

<br />

Jangan lupa buat juga file *.css untuk memperhalus tampilannya. Berikut sourcee code css yang saya gunakan.

body{
    background: url("bg.jpg") repeat;
    
}

@keyframes flow {
  0% {background-position: 0 0;}
  100% {background-position: 0 50%;}
 
}
#hw{
	font-family:Broadway;
	font-style:oblique;
	font-weight:200;
	font-size:44px;
	-moz-animation: muncul 2s ease-in-out;
	color:#039;
	
	}
table{
   margin: 20px auto;
   border-radius: 10px;
   -moz-animation: bayang 1s infinite;
   background-color:  #fff;
   border-color:#003;
   border-style: solid;
   border-width: 3px;
   padding: 0px 0px;
   -moz-animation: muncul 2s ease-in-out;
}
@keyframes muncul{
    0%{opacity:0;}
100%{opacity:100;}
}

td{
    border-radius: 10px;
    border:0;
    font-weight:bold;
    position: inherit;
	padding:10px;
    
}
select{
    width: 100px;
    border-radius: 10px;
    
    font-weight: bold;
    -moz-transition: all 1s ease-in-out;
    
}
#keptap{
    color:#fff;
    background-color: blue;
    border-radius: 10px 10px 0px 00px;
}

select:focus{
 
    width: 100px;
    border-radius: 10px;
    font-weight: bold;
    -moz-transition: all 1s ease-in-out;  
}
#submit,a{
    position: relative;
   border-style: solid;
   border-radius: 10px;
   border-width: 1px;
    padding: 10px 15px;
    font-weight: bold;
    opacity: 80%;
 background-color: blue;
    color:rgba(255,255,255,7);
    -moz-transition: all 5s ease-in-out;
   margin: 10px 78px;

}

textArea{
    
   
    width: 100px;
     -moz-transition-duration:  1s;
}
#inputtext{
   border-radius: 10px;
   padding: 5px 8px;
   background-color: #fff;
   width: 100px;
   -moz-transition-duration:  1s;
   background-color: #fff;
        
        
}

Berikut tampilan yang dihasilkan setelah source code diatas di jalankan. Selamat berkreasi :)

Praktikum PHP 3 : Style Penulisan PHP

Selasa, 03 September 2013

Assalammuallaikum Wr. Wb. Bertemu lagi dengan saya para pembaca, masih dengan topik yg sama yaitu PHP. Pada kali ini saya akan membahas tentang style penulisan pada PHP.
Baiklah cukup berbasa - basinya, marilah kita mulai proses berbagi ilmu kali ini :

Praktikum PHP 2

Jumat, 30 Agustus 2013

Asalammuallaikum Wr. Wb. Kembali lagi bersama saya yang sedikit telat dalam mengupdate blog ini, mohon di maklumi karena kesibukan yang berlebih. :) Tanpa basa - basi lagi, kali ini saya akan mengepost tentang Praktikum PHP 2. Selamat menikmati :))

Masuk ke IDE favorit anda, saya menggunakan Adobe Dreamweaver CS6.
Buat new file lalu save dengan ekstensi *.php. Lalu masukan source code di bawah ini.

<html>
	<head>
    <title>Praktikum PHP #2</title>
    	<link rel="stylesheet" href="style.css">
      </head>
	
<body><br><center>
<?php
echo "<span id='hw'>Biodata</span>";
?>
<table border=1>
<tr>
			<td><?php echo "<font color=red>Nama Lengkap</font>" ?></td>
			<td><?php echo "<font color=blue>:</font>" ?></td>
			<td><?php echo "<font color=green>Agswindo Erdi Arwanda</font>" ?></td>
            <td rowspan="9">
            <img src="AEA.JPG" width="150" height="200">
            </td>
		</tr>
<tr>
			<td><?php echo "<font color=red>Nama Panggilan</font>" ?></td>
			<td><?php echo "<font color=blue>:</font>" ?></td>
			<td><?php echo "<font color=green>Aldo</font>" ?></td>
		</tr>
<tr>
			<td><?php echo "<font color=red>Tempat,Tanggal lahir</font>" ?></td>
			<td><?php echo "<font color=blue>:</font>" ?></td>
			<td><?php echo "<font color=green>Ponorogo, 26 Februari 1997</font>" ?></td>
		</tr>
<tr>
			<td><?php echo "<font color=red>Asal SMP</font>" ?></td>
			<td><?php echo "<font color=blue>:</font>" ?></td>
			<td><?php echo "<font color=green>SMPN 1 Ponorogo</font>" ?></td>
		</tr>
<tr>
			<td><?php echo "<font color=red>Alamat</font>" ?></td>
			<td><?php echo "<font color=blue>:</font>" ?></td>
			<td><?php echo "<font color=green>Jln. Danau Poso I G2D/21</font>" ?></td>
		</tr>
<tr>
			<td><?php echo "<font color=red>Tinggi/berat</font>" ?></td>
			<td><?php echo "<font color=blue>:</font>" ?></td>
			<td><?php echo "<font color=green>167/57</font>" ?></td>
		</tr>
<tr>
			<td><?php echo "<font color=red>Cita-cita</font>" ?></td>
			<td><?php echo "<font color=blue>:</font>" ?></td>
			<td><?php echo "<font color=green>Mukmin Sukses</font>" ?></td>
		</tr>
<tr>
			<td><?php echo "<font color=red>Agama</font>" ?></td>
			<td><?php echo "<font color=blue>:</font>" ?></td>
			<td><?php echo "<font color=green>Islam</font>" ?></td>
		</tr>
<tr>
			<td><?php echo "<font color=red>Hobi</font>" ?></td>
			<td><?php echo "<font color=blue>:</font>" ?></td>
			<td><?php echo "<font color=green>Membaca, Jogging, Berenang</font>" ?></td>
		</tr>
</table>
<span id="foto"><img src="AEA.JPG" width="150" height="200"></span>

</body></center>
</html>

Jangan lupa buat juga file *.css untuk memperhalus tampilannya. Berikut sourcee code css yang saya gunakan.

body{
    background: url("bg.jpg") repeat;
    
}

@keyframes flow {
  0% {background-position: 0 0;}
  100% {background-position: 0 50%;}
 
}
#hw{
	font-family:Broadway;
	font-style:oblique;
	font-weight:200;
	font-size:44px;
	-moz-animation: muncul 2s ease-in-out;
	color:#039;
	}
table{
   margin: 20px auto;
   border-radius: 10px;
   -moz-animation: bayang 1s infinite;
   background-color:  #fff;
   border-color:#003;
   border-style: solid;
   border-width: 3px;
   padding: 0px 0px;
   -moz-animation: muncul 2s ease-in-out;
   opacity:0.7;

}

table img{
	position:relative;
	opacity:0;
}
#foto {
    opacity: 1;
    position: absolute;
    right: 340px;
    top: 200px;
}
#foto img{
	border-radius:10px;
}
@keyframes muncul{
    0%{opacity:0;}
100%{opacity:100;}
}

td{
    border-radius: 10px;
    border:0;
    font-weight:bold;
    position: inherit;
	padding:10px;
    
}
select{
    
    width: 70px;
    border-radius: 10px;
    
    font-weight: bold;
    -moz-transition: all 1s ease-in-out;
    
}
#keptap{
    color:#fff;
    background-color: blue;
    border-radius: 10px 10px 0px 00px;
}

}

Berikut tampilan yang dihasilkan setelah source code diatas di jalankan. Selamat berkreasi :)

Tutorial PHP dengan Menggunakan phpDesigner 8

Selasa, 27 Agustus 2013

Asslammuallaikum Wr. Wb. Berjumpa lagi dengan saya para pembaca, dan masih dalam pergelutan dunia PHP.
Kali ini saya akan berbagi lagi, tentunya berbagi informasi untuk anda sekalian tentang tutorial PHP tetapi dengan software yang berbeda. Pada kesempatan kali ini, saya menggunakan aplikasi phpDesigner 8. Sudah cukup berbasa - basinya pembaca, mari kita lanjutakan proses berbagi illmu ini. Silahkan menikmati :)

Tutorial PHP dengan Menggunakan NetBeans

Selasa, 27 Agustus 2013

Assalammuallaikum Wr. Wb. Berjumpa lagi dengan saya pembaca, dalam postingan kedua saya, yang masih bergelut pada tutorial PHP. Kali ini saya akan membagi informasi kepada pembaca sekalian bagaimana cara membuat ini tetapi menggunakan software yang berbeda yaitu NetBeans.

Saya kira saya sudah terlalu banyak berbasa - basi pembaca, hehehe...
Maka dari itu marilah kita lanjutkan proses berbagi illmu ini.

Pages

Praktikum PHP 6 : Validasi Form

Praktikum PHP 5

Praktikum PHP 4

Praktikum PHP 3 : Style Penulisan PHP

Praktikum PHP 2

Tutorial PHP dengan Menggunakan phpDesigner 8

Tutorial PHP dengan Menggunakan NetBeans