Form Validation & Thank You message

F_Danials

Hiya,

I have the following form. If the user doesn't enter data into any of the fields or email address is invalid, how do I change the border colour of the appropriate field(s) to red?

Also, on successful completion of the form, how do I return the user back to the form, saying a thank message "Thanks for the information"?

<html>
<head>
<title>Untitled Document</title>
</head>

<body>
<form name="form1" method="post" action=""><label>Name:</label>
  <input name="name" type="text" id="name">
  <br>
  <br>
<label>Email:</label>
  <input name="email" type="text" id="email">
  <br>
  <br>
<label>Gender:</label>
  <select name="gender" id="gender">
    <option>Male</option>
    <option>Female</option>
  </select>
  <br>
  <br>
  <label>Comments:<br>
  </label>
  <textarea name="comments" id="comments"></textarea>
  <br>
  <br>
  <input name="save" type="submit" id="save" value="Save">
</form>
</body>
</html>

bpat1434

To add a red border, I'd create a CSS class called "errored" or "error" and add that class to my errored elements. So for example:

<input type="text" name="email" value="" class="errored" />

As for checking if fields are empty or not, you can use the [man]empty/man function; to validate an email address, you'd have to create a function because there are so many things you could do. If I were to validate an email I'd have like a 3 or 4 step process:

Validate Format Validate that the email address is in fact in compliance with the RFC on email addresses. So in basic form it should be <any number, letter, or dot, hyphen, and underscore>@<domain>.<tld>.
Validate the domain exists I like to validate that the domain does in fact exist. Helps keep people from inputting "noone@blackhole.com"
Check the MX records for the domain I like to check to make sure there are valid MX records for that domain. Otherwise, I can't send email back to them 😉
Verify there is a recipient at that domain And finally by "talking" with the server I can attempt to deliver a pseudo message to see if in fact the email address exists. If the server returns an error, I can show an error, if it returns fine, then I know it's reasonably safe to assume they'll get future correspondences.

You don't need to go into that much detail, however, if you're going to be emailing people back, and you want to combat spam (or fraudulent addresses) that's a pretty good way to do it. It's not full-proof, but it will help.

F_Danials

How do I do that? Is it possible to use an array to check the fields?

bpat1434

Simply:

if(empty($_POST['input_name']))
{
    // This input was empty
}
else
{
    // This input had some value in it
}

If you wanted you could set up an array of field names which should not be empty and iterate over that array and check the $_POST array to see if the values are empty. Something like:

$notEmpty = array('name', 'email', 'comments');

foreach($notEmpty as $field)
{
    if(empty($_POST[$field]))
    {
        // This field was empty
    }
}

Not sure if that's what you were talking about or not.

Magfersile

I came accross a function that someone created recently and I've found it to be useful, especially since I don't really know javascript too well. It comes in handy for displaying error messages.

<?php
function error($msg) { 
   ?> 
   <html> 
   <head> 
   <script language="JavaScript"> 
   <!-- 
       alert("<?=$msg?>"); 
       history.back(); 
   //--> 
   </script> 
   </head> 
   <body> 
   </body> 
   </html> 
   <? 
   exit; 
}
?>

And as bpat1434 suggested, you could do something like this:

if(empty($_POST['input_name']))
{
    // This input was empty
    error('Please fill in all required fields.');
}
else
{
    // This input had some value in it
}

Which would display 'Please fill in all required fields.' and then hit the back button so no further php scripts are run.

bpat1434

I would steer clear of a pure JS solution. It's not guaranteed that everyone has javascript enabled, and then there are text-browsers that people use instead of the typical FF or IE browser. Just a word of caution.

Not to mention that the above JS function would require the user to reinput everything. So you wouldn't be able to pre-populate the fields for them in case the browser doesn't remember the values. just a usability issue that might be of concern to you.