Solved

Error checking/Validation

Posted on 2006-07-18
7
187 Views
Last Modified: 2006-11-18
I have the following form, and I want to add simple error checking.  Just so that they have to make a selection before they can submit the page.

Any simple suggestions?
------------------------------------------
<form id="guid" name="guid" method="post" action="/programs/bst.php">
              <table width="100%" border="0" cellpadding="2" cellspacing="2">
            <tr>
              <td width="42%">What is your age?: </td>
              <td width="58%"><select name="$question1">
                <option>Please Select</option>
                <option>40-49</option>
                <option>50-59</option>
                <option>60-69</option>
                <option>70-79</option>
                <option>80-89</option>
                <option>90+</option>
              </select>              </td>
            </tr>
            <tr>
              <td>Do you have any hearing loss?</td>
              <td><select name="$question2">
                <option>Please Select</option>
                <option>Yes</option>
                <option>No</option>
                            </select></td>
            </tr>
            <tr>
              <td>Is English your native language?</td>
              <td><select name="$question3">
                <option>Please Select</option>
                <option>Yes</option>
                <option>No</option>
              </select></td>
            </tr>
            <tr>
              <td>&nbsp;</td>
              <td><input type="submit" name="Submit" value="Continue"></td>
            </tr>
          </table>
          </form>
---------------------
0
Comment
Question by:a204801
  • 3
  • 2
7 Comments
 
LVL 49

Assisted Solution

by:Roonaan
Roonaan earned 150 total points
ID: 17133273
Hi,

try this:

<script type="text/javascript">
function validateForm(f) {
  var  errors = 0;
  if(f.$question1.selectedIndex < 0) {
     errors++;
     f.$question1.className = 'warning';
   } else {
     f.$question1.className = '';
   }

  if(f.$question2.selectedIndex < 0) {
     errors++;
     f.$question2.className = 'warning';
   } else {
     f.$question2.className = '';
   }

  if(f.$question3.selectedIndex < 0) {
     errors++;
     f.$question3.className = 'warning';
   } else {
     f.$question3.className = '';
   }

   return (errors == 0);
}
</script>
<style type="text/css">
select.warning {background:yellow;}
</style>

<form id="guid" name="guid" method="post" action="/programs/bst.php" onsubmit="return validateForm(this);">

-r-
0
 

Author Comment

by:a204801
ID: 17133792

with regards to the choices:


                <option>Please Select</option>
                <option>40-49</option>
                <option>50-59</option>
                <option>60-69</option>
                <option>70-79</option>
                <option>80-89</option>
                <option>90+</option>

Do I need to to something to those?
0
 
LVL 49

Expert Comment

by:Roonaan
ID: 17133853
Not espacially. You might need to change the if(f.$question1.selectedIndex < 0) { to if(f.$question2.selectedIndex < 1) { because of the first option being "Please select" for each dropdown.

-r-
0
Easy Project Management (No User Manual Required)

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 

Author Comment

by:a204801
ID: 17134645

The highlighting of the fields is great, but I also want to display a message indicating the error.  Can I do both with this code?

-Mac
0
 
LVL 49

Expert Comment

by:Roonaan
ID: 17136189
You can change the line
return (errors == 0);
to
if(errors > 0) {
  alert('Make sure to select an option from all dropdowns!');
  return false;
} else {
  return true;
}
0
 
LVL 1

Accepted Solution

by:
smackadoo earned 150 total points
ID: 17201790
For security reasons, its always best to do validation and error checking at server-side with php and not client-side with javascript

This is because
- javascript could be switched off (they are therefore submitting the form without any checks)
- they could cheat the javascript (pretty easy to do for a determined person)
- not all browsers support javascript in the same way (as i recently found out with Firefox)
- if they wanted they could save the page to their server, inject potentially harmful data, then submit it to your pages

PHP checks on submit

// checkboxes check
$a = array('Question 2'=>'question2','Question 3'=>'question3');
foreach ($a as $k => $v) {
   if ($_POST[$v] !='yes' || $_POST[$v] !='no') {
     echo '<span class="failure">An answer for '.$k.' was not selected</span>';
   }
}

Also its best to specify values on all of your <options> (and it makes it easier to check)
eg
              <option value="">Please Select</option>
                <option value="0">0-9</option>
                <option value="1">10-19</option>
                <option value="2">20-29</option>
                <option value="3">30-39</option>
                <option value="4">40-49</option>
                <option value="5">50-59</option>
                <option value="6">60-69</option>
                <option value="7">70-79</option>
                <option value="8">80-89</option>
                <option value="9">90+</option>


// dropdownboxes check
$b = array('Question 1=>'question1');
foreach ($b as $k => $v) {
   if (($_POST[$v] > 0) && ($_POST[$v] < 11)) {
     echo '<span class="failure">An answer for '.$k.' was not selected</span>';
   }
}
Then echo back the form ( writing any passed answers into your form.)
Its also better to store a single digit for age 1-10 than having "90+" stored
if you then need to write their age you get the value from your db and *10 to get the lowest value and ((*10)+9) to get highest of your range.
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
Introduction Many web sites contain image galleries; a common design for these galleries includes a page with a collection of thumbnail images.  You can click on each of the thumbnail images to see the larger version of the image.  This is easily i…
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

744 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now