Membuat Form Register Beserta Validasinya Dengan PHP

Share:

Assalamualaikum warohmatullahi wabarokatuh

Programmer Bojonegoro
- Pada postingan sebelumnya saya telah membagikan cara membuat form register beserta validasinya dengan JavaScript. Nah, kali ini saya akan membagikan contoh coding untuk membuat form register beserta validasinya dengan menggunakan PHP.

Berikut screenshoot output dari form register yang akan kita buat:
form

Berikut contoh codenya :

form.php

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8"/>
 <title>Registration Form | Programmer Bojonegoro</title>
 <link rel="stylesheet" type="text/css" href="form.css">
</head>
<body>
<?php
// define variables and set to empty values
$snameErr = $fnameErr = $emailErr = $passwdErr = $passwdConfirmErr = "";
$sname = $fname = $email = $passwd = $passwdConfirm = "";
$ceksname = $cekfname = $cekemail = $cekpasswd = $cekpasswdConfirm = 0;
//$_SERVER : variabel yang digunakan untuk mengambil data spesifik server seperti header, path dan lokasi script.
if ($_SERVER["REQUEST_METHOD"] == "POST") {
 //Fungsi empty() akan menghasilkan nilai false jika sebuah variabel telah diisi, dan bernilai true jika variabel tersebut belum diisi.
 if (empty($_POST["sname"])) {
  $snameErr = "field is required";
  $ceksname = 0;
 } else {
  $sname = test_input($_POST["sname"]);
  if (!preg_match("/^[a-zA-Z]*$/",$sname)) {
     $snameErr = "field must contain alphabets only"; 
     $ceksname=0;
  }else{
   $ceksname=1;
  }
 }

 if (empty($_POST["fname"])) {
  $fnameErr = "field is required";
  $cekfname=0;
 } else {
  $fname = test_input($_POST["fname"]);
  if (!preg_match("/^[a-zA-Z]*$/",$fname)) {
     $fnameErr = "field must contain alphabets only"; 
     $cekfname=0;
  }else{
   $cekfname=1;
  }
 }

 if (empty($_POST["email"])) {
  $emailErr = "field is required";
  $cekemail=0;
 } else {
  $email = test_input($_POST["email"]);
  if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
   $emailErr = "Invalid email address"; 
   $cekemail=0;
  }else{
   $cekemail=1;
  }
 }

 if (empty($_POST["passwd"])) {
  $passwdErr = "field is required";
  $cekpasswd=0;
 } else {
  $passwd = test_input($_POST["passwd"]);
  if(!is_numeric($_POST["passwd"])){
   $passwdErr = "field must contain numeric only";
   $cekpasswd=0;
  }else if(strlen($_POST["passwd"]) < 6){
   $passwdErr = "password entered was not 6 digits long"; 
   $cekpasswd=0;
  }else{
   $cekpasswd=1;
  }
 }

 if (empty($_POST["passwdConfirm"])) {
  $passwdConfirmErr = "field is required";
  $cekpasswdConfirm=0;
 } else {
  $passwdConfirm = test_input($_POST["passwdConfirm"]);
  if(!is_numeric($_POST["passwdConfirm"])){
   $passwdConfirmErr = "field must contain numeric only";
   $cekpasswdConfirm=0;
  }else if(strlen($_POST["passwdConfirm"]) < 6){
   $passwdConfirmErr = "password entered was not 6 digits long"; 
   $cekpasswdConfirm=0;
  }else if($_POST["passwd"]!=$_POST["passwdConfirm"] ) {
   $passwdConfirmErr = "password do not match";
   $cekpasswdConfirm=0;
  }else {
   $cekpasswdConfirm=1;
 }
}
}

if($ceksname == 1 && $cekfname == 1 && $cekemail == 1 && $cekpasswd == 1 && $cekpasswdConfirm == 1){
 header('Location: processData.php'); 
}

function test_input($data) {
  $data = trim($data);//fungsi trim() untuk menghapus karakter yang tidak diperlukan seperti ekstra spasi, tab dan baris baru
  $data = stripslashes($data);//fungsi stripslashes() untuk membuang tanda backslash (/) dari input yang dimasukkan oleh pengguna
  $data = htmlspecialchars($data);//fungsi htmlspecialchars() untuk mengubah karakter-karakter khusus html seperti < menjadi &lt; dan > menjadi &gt;
  return $data;
}
?>

<div class="content">
 <h1>Registration Form</h1>
 <fieldset>
  <legend>Person Details</legend>
  <form name="myForm" method="POST">
   <div class="field">
    <label>Surename</label>
    <input type="text" id="sname" placeholder="Enter Surename" name="sname" value="<?php echo $sname;?>"/>
    <span class="error"><?php echo $snameErr;?></span>
   </div>
   <div class="field">
    <label>Firstname</label>
    <input type="text" placeholder="Enter Firstname" name="fname" value="<?php echo $fname;?>"/>
    <span class="error"><?php echo $fnameErr;?></span>
   </div>
   <div class="field">
    <label>Email address</label>
    <input type="text" placeholder="Enter Email" name="email" value="<?php echo $email;?>"/>
    <span class="error"><?php echo $emailErr;?></span>
   </div>
   <div class="field">
    <label>Password</label>
    <input type="password" placeholder="Enter Password" name="passwd" value="<?php echo $passwd;?>"/>
    <span class="error"><?php echo $passwdErr;?></span>
   </div>
   <div class="field">
    <label>Confirm password</label>
    <input type="password" placeholder="Repeat Password" name="passwdConfirm" value="<?php echo $passwdConfirm;?>"/>
    <span class="error"><?php echo $passwdConfirmErr;?></span>
   </div>
   <br/>
   <input type="submit" value="Register" name="register"/>
   <input type="reset" value="Reset" name="reset"/>
  </form>
 </fieldset>
<br/>
<br/>
<br/>
<h2>PROGRAMMER BOJONEGORO</h2>
</div>
</body>
</html>
Note : code diatas digunakan untuk form dan validasinya.

form.css

body{
 background-color: #9999FF;
 font-family: Verdana, geneva, Arial, Helvetica, sans-serif;
 margin:0px;
 min-width: 600px;
}
.error {
 color: #FF0000;
 font-size: 15px;
 font-weight: normal;
}
div.content {
 padding: 10px;
 height: 650px;
 margin-top: 100px;
 margin-left: 80px;
 margin-right: 80px;
 border:1px solid black;
 background-color: white;
}
legend{
 font-size: large;
 font-weight: bold;
 margin-bottom: 10px;
}
fieldset{
 background-color: #ddddff;
 padding: 10px;
}
label{
 float: left;
 margin-right: 20px;
 width: 200px;
 text-align: right;
}
.field{
 font-size: 15px;
 font-weight: bold;
 margin: 2px;
}
input[type=submit]{
  cursor: pointer;
  margin-left: 220px;
}
input[type=reset]{
 cursor: pointer;
 margin-left: 18px;
}
h2{
 text-align: center;
}
Note : code diatas digunakan untuk mengatur tampilan seperti posisi, warna, font, dan lain-lain.

Baca juga : jenis-jenis sintaks CSS beserta penjelasannya

prosesData.php

<!DOCTYPE html>
<html>
<head>
 <title>Data Registration</title>
 <link rel="stylesheet" type="text/css" href="form.css">
</head>
<body>
<div class="content">
 <h1>Registration Form</h1>
 <fieldset>
  <legend>Person Details</legend>
  <h3>Form submitted successfully with no errors</h3>
 </fieldset>
</div>
</body>
</html>
Note : code diatas akan digunakan untuk membuat tampilan ketika user mengisi form register dengan benar tanpa error.

Alhamdulillah, itulah code untuk membuat form register beserta validasinya dengan PHP.

Terimakasih telah berkunjung ke blog sederhana ini.

Semoga bermanfaat...

Wassalamualaikum warohmatullahi wabarokatuh

No comments