How to Validate a Form Using PHP Part 1: Complete with Error Messages! ~ Techie Blog

How to Validate a Form Using PHP Part 1: Complete with Error Messages!

Having a site visitor fill out a form is the primary way to gather information. Forms are the main line of communication with anyone that visits your site, so taking the time to make sure users fill them out correctly is key. Using PHP, we are able to ensure that all fields are properly filled out before submission, with required adjustments being called to attention through the use of error messages.

The CSS & HTML Groundwork

Let’s start off by opening up a fresh php document and putting a form within it. I have created errorpart1.php

view plaincopy to clipboardprint?
<html>  
    <head>  
        <title>Form validation using PHP</title>  
        <style type="text/css"><!--Styles--></style>  
    </head>  
    <body>  
        <div id="content">  
           <!--PHP and Form to go here-->  
        </div>  
    </body>  
</html>  

With the following styles applied to the form:

view plaincopy to clipboardprint?
*{  
    padding:0px;  
    margin:0px;  
}  
body{  
    text-align:center;  
    font:11px "Lucida Grande",Arial,sans-serif;  
}  
#content{  
    width:300px;  
    text-align:left;  
    margin:10px;  
}  
.formitem{  
    width:100%;  
    padding: 6px;  
    font:11px "Lucida Grande",Arial,sans-serif;  
}  
h2{  
    font:18px "Helvetica",Arial,sans-serif;  
}  
.box{  
    width:100%;  
    padding:10px 0px 10px 5px;  
    margin-bottom: 8px;  
    font-weight:bold;  
}  
.green{  
    background-color:#95ca78;  
    border-bottom:solid 1px #8AA000;  
}  
.red{  
    background-color:#FDCBCA;  
    border-bottom:solid 1px #E8514A;  
}  

Next we have to construct our form, I have chosen to create a three field form, including one hidden field entitled “submitted”, which serves to check if the form has been completed.

view plaincopy to clipboardprint?
<form action="index.php" method="POST" enctype="multipart/form-data">  
    <h2>Title</h2>  
    <input class="formitem" type="text" name="title"/>  
    <br/><br/>  
    <h2>Content</h2>  
    <textarea class="formitem" name ="textentry" rows="3"></textarea>  
    <input type="hidden" name="submitted" value="1">  
    <br/><br/>  
    <input type="submit" value="Submit"/>  
</form>  

Now that we’ve laid out and styled up our page, it’s time to come in with some PHP.

The PHP and Validation

First we’ll use the hidden field (“submitted”) that we created earlier to check if the form is ready to be validated aka if they submitted it. We can do this with a simple IF statement, checking to see if submitted has a value of “1″, which it it automatically set to on form submission. This prevents error messages from popping up unless the form was actually completed and turned in.

view plaincopy to clipboardprint?
<?php  
//If form was submitted  
if ($_POST['submitted']==1) {  
   //Do something  
}  
?>  

Next up we have to check each mandatory field for a value of some kind. I have decided that both the title and content fields are mandatory for this example. The below code checks for values in each field on the form and assigns them to a variable if they exist.

view plaincopy to clipboardprint?
<?php  
//If form was submitted  
if ($_POST['submitted']==1) {  
    if ($_POST[title]){  
        $title = $_POST[title]; //If title was entered  
    }  
    if ($_POST[textentry]){  
        $textentry = $_POST[textentry]; //If comment was entered  
    }  
}  

Now that we have put the values retrieved from the form into variables, we can perform a check to see if any are blank. If they have all been filled out properly, a message alerts them they completed the form properly.

view plaincopy to clipboardprint?
//If all fields present  
if ($title && $textentry){  
    //Do something  
    echo "<div class=\"box green\">Form completed!</div>";  
}  
?>  

Now for those of you that are currently questioning why I didn’t combine the last two parts into one big IF statement, hold on, it’s error message time.

At this point in the game, we want to go back to where we first assigned the $_POST variables to strings variables, appending an else to each IF statement.

view plaincopy to clipboardprint?
if ($_POST['submitted']==1) {  
    $errormsg = ""; //Initialize errors  
    if ($_POST[title]){  
        $title = $_POST[title]; //If title was entered  
    }  
    else{  
        $errormsg = "Please enter title";  
    }  
    if ($_POST[textentry]){  
        $textentry = $_POST[textentry]; //If comment was entered  
    }  
    else{  
        if ($errormsg){ //If there is already an error, add next error  
            $errormsg = $errormsg . " & content";  
        }else{  
            $errormsg = "Please enter content";  
        }  
    }  
}  

That last section might have seemed like a lot, so let’s break it down.

First off we established the variable $errormsg, which will contain a string with all the errors we come across.

view plaincopy to clipboardprint?
$errormsg = ""; //Initialize errors  

Next we append the first IF statement for the title field, stating that if there is no value, set the $errormsg to store that error.

view plaincopy to clipboardprint?
else{  
    $errormsg = "Please enter title";  
}  

When we check the next field, textentry, we will essentially be doing the same thing, although this time we must check if $errormsg has any errors stored from the previous IF. Should this be the case, we must append our current error message to the previous one.

view plaincopy to clipboardprint?
else{  
    if ($errormsg){ //If there is already an error, add next error  
         $errormsg = $errormsg . " & content";  
    }else{  
         $errormsg = "Please enter content";  
    }  
}  

At this point your $errormsg variable should have an accurate list of error messages stored. Now it is time to alert the user of any problems.

view plaincopy to clipboardprint?
if ($errormsg){ //If any errors display them  
    echo "<div class=\"box red\">$errormsg</div>";  
}  

Techie Blog

Tuesday, May 21, 2013