This is what I've been working on:
A form will have the following fields:
- first name – text field
- last name – text field
- address – text field
- city – text field
- state – drop-down list
- zip – text field
- phone – text field
- credit card type – radio button
- credit card number – text field
- expiration date – drop down lists
- comments – text area
All of the fields except the comments field are required. This means that if I type in blank characters (like spaces), the form should not allow me to submit. Whitespace characters are not considered valid entries into any field. In addition, the zip field must contain exactly 5 numbers. The phone field must contain 3 numbers followed by a hyphen, then 3 more numbers followed by a hyphen, then 4 numbers. The credit card number must contain 4 numbers followed by a space, then 4 more numbers followed by a space, then 4 more numbers followed by a space, then 4 more numbers.
The page should always be submitted to the second page, regardless of whether the data is valid or not. If the form is not valid, the second page will display the form again, and the focus of the cursor should be placed in the first field that is not valid. For example, if the city field is the first field that is blank, after the user clicks submit, he should be taken to the second page, and then the cursor should be placed in the city field. All of the fields that are in violation of the above rules should have messages displayed next to the fields alerting the user as to the problem.
And, this is what I've till now:
<?php
$fname=$_POST['fname'];
$lname=$_POST['lname'];
$address=$_POST['address'];
$city=$_POST['city'];
$state[]=$_POST['state'];
$zipcode=$_POST['zipcode'];
$phone=$_POST['phone'];
$cctype=$_POST['cctype'];
$ccnumber=$_POST['ccnumber'];
$expdate=$_POST['expdate'];
$comments=$_POST['comments'];
if (array_key_exists('_submit_check', $_POST)) {
if(!$fname){ $fname_err='1'; }
if(!$lname){ $lname_err='1';}
if(!$address){ $address_err='1';}
if(!$city){ $city_err='1';}
if(!$state){ $state_err='1';}
if((!$zipcode) && (strlen('$zipcode') < 4))
{ $zipcode_err='1'; }
if(!$phone){ $phone_err='1';}
if(!$cctype){ $cctype_err='off';}
if(!$ccnumber){ $ccnumber_err='1';}
if(!$expdate){ $expdate_err='1';}
}
?>
And the form:
<form name="form1" method="post" action="">
<table>
<tr>
<td>First Name </td>
<td><input type="text" name="fname"><?php if($fname_err=='1') echo "Please enter your first name"; ?>
</td>
</tr>
<tr>
<td>Last Name</td>
<td><input type="text" name="lname"> <?php if($lname_err==1) echo "Please enter your last name"; ?>
</td>
</tr>
<tr>
<td>Address</td>
<td><input type="text" name="address"> <?php if($address_err==1) echo "Please enter your address"; ?>
</td>
</tr>
<tr>
<td>City</td>
<td><input type="text" name="city"> <?php if($city_err==1) echo "Please enter your city name"; ?>
</td>
</tr>
<tr>
<td>State</td>
<td>
<select name="state" multiple size="5">
<option value="AL">Alabama
....
<option value="WY">Wyoming
</select><?php if($state_err==1) echo "Please select your state(s)"; ?>
</td>
</tr>
<tr>
<td>Zip Code</td>
<td><input type="text" name="zipcode"> <?php if($zipcode_err==1) echo "Please enter your zipcode"; ?>
</td>
</tr>
<tr>
<td>Phone</td>
<td><input type="text" name="phone"> <?php if($phone_err==1) echo "Please enter your phone no."; ?>
</td>
</tr>
<tr>
<td>Credit Card Type</td>
<td>
<input type="radio" name="cctype" value="Visa">Visa
<input type="radio" name="cctype" value="Mastercard">Mastercard
<input type="radio" name="cctype" value="American Express">American Express
<input type="radio" name="cctype" value="Discover">Discover <?php if($cctype_err=='off') echo "Please select your credit card type"; ?>
</td>
</tr>
<tr>
<td>Credit Card Number</td>
<td><input type="text" name="ccnumber"><?php if($ccnumber_err==1) echo "Please enter your credit card no."; ?>
</td>
</tr>
<tr>
<td>Expiration Date</td>
<td>
<select name="expdate" size="1">
<option selected>Select Date</option>
<option value="March 2006">03/06
<option value="April 2006">04/06
....
</select><?php if($expdate_err==1) echo "Please select expiration date"; ?>
</td>
</tr>
<tr>
<td>Comments</td>
<td>
<textarea name="comments" rows="7" cols="50">Enter your comments here
</textarea>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="hidden" name="_submit_check" value="1"/>
<input type="submit" name="cmdSubmit" value="Validate!">
</td>
</tr>
</table>
</form>
I don't know how to get the "focus" and the phone validation going. Any help would be great.. thnx.