Cara Membuat Form Validasi Dengan PHP

Hai sobat Dewa Coding 21 selamat berkunjung kembali di blog kami :)

Untuk postingan sekarang admin akan membahas tentang cara membuat form validasi dengan PHP, jadi anda-anda semua juga harus tau cara membuatnya jangan cuma download aja :D Script-scriptnya pun tidak susah dan juga mudah untuk di pahaminya, karna sedikit scriptnya dan tidak hanya sistemnya tapi admin juga memberikan tampilan yang lumayan bagus

Oke kita lanjut saja ke cara membuat nya.

1. anda silahkan buat file Validation.php, fungsinya sebagai sistem untuk validasinya, dan silahkan masukkan script berikut kedalam file validation.php

$nameError ="";
$emailError ="";
$genderError ="";
$websiteError ="";
$messageError ="";
 
$iconError ="";
 
if(isset($_POST['submit'])){
 if (empty($_POST["name"])) {
  $nameError = "* Name is required";
  $iconError = "<img src='img/warning.png' style='margin-left: 10px; width: 20px;'>";
 } else {
  $name = test_input($_POST["name"]);
  
  if (!preg_match("/^[a-zA-Z ]*$/",$name)) {
   $nameError = "* Only letters and white space allowed";
   $iconError = "<img src='img/warning.png' style='margin-left: 10px; width: 20px;'>";
  }
 }
  
 if (empty($_POST["email"])) {
  $emailError = "* Email is required";
  $iconError = "<img src='img/warning.png' style='margin-left: 10px; width: 20px;'>";
 } else {
  $email = test_input($_POST["email"]);
  if (!preg_match("/([\w\-]+\@[\w\-]+\.[\w\-]+)/",$email)) {
   $emailError = "* Invalid email format";
   $iconError = "<img src='img/warning.png' style='margin-left: 10px; width: 20px;'>";
  }
 }
  
 if (empty($_POST["website"])) {
  $website = "";
  $websiteError = "* Website is required";
 } else {
  $website = test_input($_POST["website"]);
  
  if (!preg_match("/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-9+&@#\/%?=~_|!:,.;]*[-a-z0-9+&@#\/%=~_|]/i",$website)) {
   $websiteError = "* Invalid URL";
   $iconError = "<img src='img/warning.png' style='margin-left: 10px; width: 20px;'>";
  }
 }
  
 if (empty($_POST["message"])) {
  $messageError = "* Message is required";
  $iconError = "<img src='img/warning.png' style='margin-left: 10px; width: 20px;'>";
 } else {
  $message = test_input($_POST["message"]);
 }
  
 if (empty($_POST["gender"])) {
  $genderError = "* Gender is required";
  $iconError = "<img src='img/warning.png' style='margin-left: 10px; width: 20px;'>";
 } else {
  $gender = test_input($_POST["gender"]);
 }
}
 
function test_input($data) {
 $data = trim($data);
 $data = stripslashes($data);
 $data = htmlspecialchars($data);
 return $data;
}

2. Setelah script diatas dipindahkan kedalam file validation.php selanjutnya silahkan buat file baru dengan nama index.php, file ini untuk halaman utamanya atau bisa kita sebut UI nya, tapi disini cuman sciprt html biasa aja belum ada style-stylenya hehe. Dan setelah dibuat file index.php selanjutnya silahkan masukan script berikut kedalam file index.php

<?php include "validation.php"; ?>

<!DOCTYPE html>
<html>
<head>
<title>Form Validation with PHP - Dewa Coding 21</title>
<link href='https://fonts.googleapis.com/css?family=Raleway|Lato' rel='stylesheet' type='text/css'>
<link href="style.css" rel="stylesheet">
</head>
<body>
<div class='form'>
<h2>Form Validation with PHP</h2>
<form action="" method="post">
<div class='form-group'><br>
<div class='label'>
Name <span class='red'>*</span>
</div>

<div class='input'>
<input class="input" name="name" type="text" value=""><?php echo $iconError; ?><?php echo $iconSuccess; ?>
</div>
<span class="error"><?php echo $nameError;?></span>
</div>

<div class='form-group'>
<div class='label'>
E-mail <span class='red'>*</span>
</div>

<div class='input'>
<input class="input" name="email" type="text" value=""><?php echo $iconError; ?>
</div>
<span class="error"><?php echo $emailError;?></span>
</div>

<div class='form-group'>
<div class='label'>
Gender <span class='red'>*</span>
</div>

<input class="radio" name="gender" type="radio" value="female">Female
<input class="radio" name="gender" type="radio" value="male">Male<?php echo $iconError; ?><br>
<span class="error"><?php echo $genderError;?></span>
</div>

<div class='form-group'>
<div class='label'>
Website <span class='red'>*</span>
</div>

<div class='input'>
<input class="input" name="website" type="text" value=""><?php echo $iconError; ?>
</div>
<span class="error"><?php echo $websiteError;?></span>
</div>

<div class='form-group'>
<div class='label'>
Message <span class='red'>*</span>
</div>

<div class='input'>
<textarea cols="40" name="message" rows="5"></textarea><?php echo $iconError; ?>
</div>
<span class="error"><?php echo $messageError;?></span>
</div>

<input class="submit" name="submit" type="submit" value="Submit">
</form>
</div>
</body>
</html>

3. Dan yang terakhir silahkan anda buat file style.css yang berfungsi untuk mempercantik tampilan file index.php tadi. setelah anda buat silahkan masukkan script berikut.

body {
 margin: 0;
 padding: 0;
 background: #f2f2f3;
 font-family: 'Lato', sans-serif;
}
.red {
 color: #e02222;
 margin-left: 0px !important;
 font-size: 14px !important;
}
.form {
 width: 500px;
 margin: 100px auto;
 border: 1px solid #3598dc;
}
.form form {
 padding: 10px 15px;
 background: #fff;
}
.form h2 {
 margin: 0;
 background: #3598dc;
 color: #fff;
 font-weight: 300;
 padding: 8px 12px;
 font-family: 'Raleway', sans-serif;
}
.form-group {
 margin-bottom: 20px;
}
.label {
 width: 100px !important;
 float: left;
}
.input input {
 width: 300px;
 border: 1px solid #c0c0c0;
 padding: 4px 8px;
 height: 20px;
 font-family: 'Lato', sans-serif;
}
.form span {
 margin-left: 100px;
 font-size: 12px;
 color: #e02222;
}
.submit {
 background: #3598dc;
 color: #fff;
 padding: 8px 12px;
 border: 1px solid transparent;
 font-size: 16px;
 border-radius: 3px;
}
.submit:hover {
 background: #2a80b9;
 cursor: pointer;
}

Dan selesai sudah cara membuat form validasi dengan PHP berikut Design nya juga, Terima kasih sudah mengunjungi blog kami dan mudah-mudahan postingan admin kali ini bermanfaat yah.

Untuk Source Code nya bisa anda download Disini / Here

Jangan lupa berkomentar :)

Cara Membuat Form Validasi Dengan PHP

4/ 5

Oleh Unknown

Unknown Pada 14:06:00 1 Komentar

Monday 14 December 2015