In this article we are going to see how to validate a HTML form using PHP. We have already written about how to validate form using jQuery. Server side form validation is used for additional security with client side validation.
In this tutorial we will see how to use the HTML contact form on the website and validate user input before submitting form using PHP. The contact form have a number of input fields like name,email ,gender, website and comment.
Firstly , we have to create an HTML form to integrate them on form submit checking that user input is correct or not. If user input is clean and correct, then form will be submitted successfully, otherwise it will return error. Any errors during form submission will be highlighted with specific messages.
Form validation is a process to confirm that user given input is clean and correct.
Read:
JavaScript Validation Using Sample Form
PHP Form validation process does the following things:
-
- Clean the user given input.
-
- has the user given input for all required fields.
-
- Has the user entered valid input.
- Remember user filled input and auto filled it when form reload due to validation error.
HTML FORM:
Creating a simple html form with POST method so that user input will not display in URL after form submission. Now on form submit validate user input and perform action if the input is correct otherwise it will highlight the error so that user can correct and resubmit the form. Have a look at the form.
HTML
<div class="main"> <h3 class="heading">Contact Form</h3> <form method="POST" class="form"> <label class="title">Name:</label> <input class="form-input" type="text" name="name" value="<?php echo $name; ?>"> <span class="error"><?php echo $nameError; ?></span> <label class="title">Email:</label> <input class="form-input" type="text" name="email" value="<?php echo $email; ?>"> <span class="error"><?php echo $emailError; ?></span> <label class="title">Website:</label> <input class="form-input" type="text" name="website" value="<?php echo $website; ?>"> <span class="error"><?php echo $websiteError; ?></span> <label class="title">Message:</label> <textarea name="message" cols="45" rows="5"><?php echo $message; ?></textarea> <span class="error"><?php echo $messageError; ?></span> <input class="btn" type="submit" name="save" value="Submit"> </form> </div>
PHP
<?php
//define variables and initialize it with empty values
$name = $email = $website = $message = "";
//define error variables and initialize it with empty values
$nameError = $emailError = $websiteError = $messageError = "";
if(isset($_POST['save']))
{
if(empty($_POST['name']))
{
$nameError = "Name is required!";
}
else
{
$name = test_user_input($_POST['name']);
//check for name only contain letters and white space
if (!preg_match("/^[a-zA-Z ]*$/",$name)) {
$nameError = "Only letters & white space allowed";
}
}
if(empty($_POST['email']))
{
$emailError = "Email is required!";
}
else{
$email = test_user_input($_POST['email']);
//check for valid email address format
if(!filter_var($email, FILTER_VALIDATE_EMAIL))
{
$emailError = "Invalid email format!";
}
}
if(empty($_POST['website']))
{
$websiteError = "Website is required!";
}
else
{
$website = test_user_input($_POST['website']);
if if (!filter_var($website, FILTER_VALIDATE_URL))
{
$websiteError = "Invalid website URL format!";
}
}
if(empty($_POST['message']))
{
$messageError = "Message is required!";
}
else
{
$message = test_user_input($_POST['message']);
}
}
//function to clean user given input value
function test_user_input($value)
{
$value = trim($value);
$value = stripslashes($value);
$value = htmlspecialchars($value);
return $value;
}
?>
CSS
.main{
width:550px;
margin: 0 auto;
padding:30px;
background: #efefef;
}
.form{
width:334px;
margin: 0 auto;
}
.heading{
text-align:center;
}
.form-input{
width: 334px;
height: 40px;
padding: 10px;
margin: 10px 0;
}
.title{
display: block;
margin: 2px 0px;
padding: 2px;
font-weight: 600;
color: #00BCD4;
}
.btn{
width: 150px;
height: 41px;
padding: 3px;
display: block;
margin: 18px 0;
color: #fff;
background: #0095ff;
font-weight: bold;
border: none;
}
.error{
color:red;
}
Now user can’t leave input field blank or submit any invalid records. Form validation will restrict to do so. If you have any query feel free to write comment.