Server Side Form Validation using Regular Expressions

Some days back I had posted ” Perfect Javascript Form Validation using Regular Expressions “, Now in this post I given a simple example about “Server Side Form Validation using Regular Expressions “.

Perfect Javascript Form Validation using Regular Expressions
Jquery Validation with Regular Expressions

index.php
Contains PHP code. preg_match — Case insensitive regular expression match.

<?php
// define variables and set to empty values
$nameErr = $emailErr = $phoneErr = $genderErr = "";
$name = $email = $phone = $gender = "";

if ($_SERVER["REQUEST_METHOD"] == "POST") 
{
  if (empty($_POST["name"])) {
    $nameErr = "Name is required";
  	} else {
    $name = test_input($_POST["name"]);
    // check if name only contains letters and whitespace
    if (!preg_match("/^[a-zA-Z ]*$/",$name)) {
      $nameErr = "Only letters and white space allowed";
    }
  }

  if (empty($_POST["email"])) {
    $emailErr = "Email is required";
  	} else {
    $email = test_input($_POST["email"]);
    // check if e-mail address is well-formed
    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
      $emailErr = "Invalid email format";
    }
  }
  
  if (empty($_POST["phone"])) {
    $phoneErr = "Phone is required";
  	} else {
    	$phone = test_input($_POST["phone"]);
  		if(preg_match("/^\d+\.?\d*$/",$phone) && strlen($phone)==10){
    	}
    else
    {
     		$phoneErr =   'Invalid Phone Number';
      $phone='';
    }
  }	
 	if (empty($_POST["gender"])) {
     $genderErr = "Gender is required";
  	} else {
    $gender = test_input($_POST["gender"]);
  	} 
}

function test_input($data) {
  $data = trim($data);
  $data = stripslashes($data);
  $data = htmlspecialchars($data);
  return $data;
} 


if(!empty($name) & !empty($email) & !empty($phone) & !empty($tax_amount))
{
   header("location:thanks.html");
}
?> 

HTML code

<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="post">
      <div>
        <input type="text" name="name" class="form-control" placeholder="Full Name:" value="<?php echo $name;?>">
        <span class="error">* <?php echo $nameErr;?></span>
      </div>
    <?php /*?>  <div class="form-group">
        <input type="text" name="Name" class="form-control" placeholder="Last Name:" value="<?php echo $lname;?>">
      </div><?php */?>
      <div>
        <input type="text" name="email" class="form-control" placeholder="Email:" value="<?php echo $email;?>">
        <span class="error">* <?php echo $emailErr;?></span>
      </div>
      <div>
        <input type="text" name="phone" class="form-control" placeholder="Phone #:" value="<?php echo $phone;?>">
        <span class="error">* <?php echo $phoneErr;?></span>
      </div>
      <div>
        <select class="form-control" name="gender">
        	<?php if($gender == '') { ?> <option value="0" selected>Gender</option> <?php  } else { ?>
            <option value="<?php echo $gender;?>" selected><?php echo $gender;?></option>
            <?php } ?>
            <option value="1">Male</option>
            <option value="2">Female</option>
        </select>
        <span class="error">* <?php echo $genderErr;?></span>
      </div>
      <button type="submit" class="click-btn">Submit Form</button>
    </form>

CSS CODE

.banner-form{ width:400px; padding:0px 0px 40px 0px; background:rgba(255,255,255,0.9); top:0; height:440px; right:6%; -moz-box-shadow: 0 -8px 10px #888; -webkit-box-shadow: 0 -8px 10px#888; box-shadow: 0 -8px 10px #888;}
.banner-form h2{ font-size:25px; color:#fff; padding-bottom:10px; background-color:#333; padding:15px 20px; text-align:center; font-weight:500px;}
.banner-form .form-control{ border-radius:0; height:40px;}
.banner-form button{ width:100%; border-radius:0; margin-bottom:0; padding: 12px; margin-top:5px;}
.banner-form .consultation-form{ padding:30px 40px;}

.error {color: #FF0000;}

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
a.click-btn:hover, .click-btn:hover {
    background-color: #000;
    color: #fff;
}
.banner-form button {
    width: 100%;
    border-radius: 0;
    margin-bottom: 0;
    padding: 12px;
    margin-top: 5px;
}
a.click-btn, .click-btn {
    background-color: #089de3;
    border: 0;
    color: #fff;
    font-size: 14px;
    margin-bottom: 8px;
    padding: 8px 15px;
    border-radius: 2px;
    font-weight: 500;
    transition: all 0.3s ease 0s;
    text-transform: uppercase;
}
.click-btn {
    float: none;
    display: inline-block;
}

Please follow and like us: