Java Script Issue

by otfromtot Posted: 14 years ago 2 replies

My site has a form that has requirements to be submitted, but if javascript is disabled the requirements are no longer required.

<input name="estimated_ship_date" type="text" required="required" id="estimated_ship_date" style="width:80px; float:right;" maxlength="10" />

the required="required" part does not work in internet explorer 8, possibly 9, and then there is this as well:

<script language="JavaScript" type="text/javascript" xml:space="preserve">
//<![CDATA[
//You should create the validator only after the definition of the HTML form
var frmvalidator = new Validator("quoteForm");
frmvalidator.EnableOnPageErrorDisplaySingleBox();
frmvalidator.EnableMsgsTogether();

frmvalidator.addValidation("estimated_ship_date"," req","Please select your estimated ship date");
//]]></script>

the form has another dozen entry fields an I need a work around to make this work if javascript is disabled.

#website design #issue #java #script

Brandon Tanner 14 years ago

Why not just use PHP to validate your forms? That would be the most reliable method, as it will work even if Javascript is disabled. Just Google "PHP form validation"... there are lots of tutorials for that out there.
- [ 1 ] Thanks
otfromtot 14 years ago

This is what I have now, which the validate works, but if i leave the form action="process.php" it doesn't validate. I'm not to familiar with php, but I believe I need something at the end of this like $_POST [process.php] or something...

<?php

if($_POST)
{
$first_name = $_POST['first_name'];
$last_name = $_POST['last_name'];
$phone = $_POST['phone'];
$email = $_POST['email'];
$year1 = $_POST['year1'];
$make1 = $_POST['make1'];
$model1 = $_POST['model1'];
$vehicle_type_id1 = $_POST['vehicle_type_id1'];
$pickup_city = $_POST['pickup_city'];
$pickup_state_code = $_POST['pickup_state_code'];
$dropoff_city = $_POST['dropoff_city'];
$dropoff_state_code = $_POST['dropoff_state_code'];
$vehicle_runs = $_POST['vehicle_runs'];
$ship_via_id = $_POST['ship_via_id'];
$estimated_ship_date = $_POST['estimated_ship_date'];

// First Name
if (preg_match("/^[A-Za-z -]{3,20}$/",$first_name))
{
$valid_first_name=$first_name;
}
else
{
$error_first_name='Enter valid First Name.';
}
// Last Name
if (preg_match("/^[A-Za-z -]{3,20}$/",$last_name))
{
$valid_last_name=$last_name;
}
else
{
$error_last_name='Enter valid Last Name.';
}
// Phone
if (preg_match("/^[0-9 -]{3,20}$/",$phone))
{
$valid_phone=$phone;
}
else
{
$error_phone='Enter valid Phone Number.';
}
// Email
if (preg_match("/^[a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\.([a-zA-Z]{2,4})$/", $email))
{
$valid_email=$email;
}
else
{
$error_email='Enter valid Email.';
}
// Year
if (preg_match("/^[0-9 -]{2,20}$/",$year1))
{
$valid_year1=$year1;
}
else
{ $error_year1='Enter valid Vehicle Year.'; }

// Make

if (preg_match("/^[A-Za-z0-9 -]{2,25}$/",$make1))
{
$valid_make1=$make1;
}
else
{
$error_make1='Enter valid Vehicle Make.';
}
// Model

if (preg_match("/^[A-Za-z0-9 -]{2,25}$/",$model1))
{
$valid_model1=$model1;
}
else
{
$error_model1='Enter valid Vehicle Model.';
}

// Vehicle Type
if ($vehicle_type_id1==00)
{
$error_vehicle_type_id1='Select Vehicle Type';
}
else
{
$valid_vehicle_type_id1=$vehicle_type_id1;

}
// Pickup City
if (preg_match("/^[A-Za-z0-9 -]{3,20}$/",$pickup_city))
{
$valid_pickup_city=$pickup_city;
}
else
{
$error_pickup_city='Enter valid Pickup City.';
}
// Pickup state
if ($pickup_state_code==00)
{
$error_pickup_state_code='Select Pickup State.';
}
else
{
$valid_pickup_state_code=$pickup_state_code;

}
// Dropoff City
if (preg_match("/^[A-Za-z0-9 -]{3,20}$/",$dropoff_city))
{
$valid_dropoff_city=$dropoff_city;
}
else
{
$error_dropoff_city='Enter valid Dropoff City.';
}
// Dropoff state
if ($dropoff_state_code==00)
{
$error_dropoff_state_code='Select Dropoff State.';
}
else
{
$valid_dropoff_state_code=$dropoff_state_code;

}
// Vehicle Runs
if ($vehicle_runs==00)
{
$error_vehicle_runs='Does your vehicle run?';
}
else
{
$valid_vehicle_runs=$vehicle_runs;

}
// Ship Via
if ($ship_via_id==00)
{
$error_ship_via_id='Select how to ship.';
}
else
{
$valid_ship_via_id=$ship_via_id;

}
// Estimated Shipping Date
if (preg_match("/^[0-9]{1,2}\/[0-9]{1,2}\/[0-9]{4}$/",$estimated_ship_date))
{
$valid_estimated_ship_date=$estimated_ship_date;
}
else
{
$error_estimated_ship_date='Enter valid Shipping Date.';
}

if((strlen($valid_first_name)>0)&&(strlen($valid_l ast_name)>0)&&(strlen($valid_phone)>0)&&(strlen($v alid_email)>0)&&(strlen($valid_year1)>0)&&(strlen( $valid_make1)>0)&&(strlen($valid_model1)>0) && ($valid_vehicle_type_id1>0 )&&(strlen($valid_pickup_city)>0)&&($valid_pickup_ state_code>0 )&&(strlen($valid_dropoff_city)>0) && ($valid_dropoff_state_coder>0 ) && ($valid_vehicle_runs>0 ) && ($valid_ship_via_id>0 ) && strlen($valid_estimated_ship_date)>0)
{

}
else
{
}

}
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>PHP Validate</title>


<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />


<link rel="stylesheet" href="css/structure.css" type="text/css" />
<link rel="stylesheet" href="css/form.css" type="text/css" />


<script type="text/javascript" src="js/9lessons.js"></script>
<style type="text/css">
.err
{
font-size:11px;
padding-left:10px;
color:#CC0000;
float:left;

}
input
{
float:left;

}
</style>

</head>

<body id="public">
<div style="height:30px"></div>

<div id="container">

<div style="height:30px"></div>

<form autocomplete="off"
enctype="multipart/form-data" method="post" action="" name="form">

<ul>

<li id="foli1" class=" ">
<label class="desc" id="title1" for="Field1">
First Name </label>
<div>
<input id="first_name" name="first_name" type="text" class="field text medium" value="<?php echo $valid_first_name; ?>" maxlength="255" tabindex="1" /><span class="err"> <?php echo $error_first_name; ?></span>
</div>
</li>
<li id="foli2" class=" ">
<label class="desc" id="title1" for="Field2">
Last Name </label>
<div>
<input id="last_name" name="last_name" type="text" class="field text medium" value="<?php echo $valid_last_name; ?>" maxlength="255" tabindex="2" />
</div>
<div><span class="err"> <?php echo $error_last_name; ?></span>
</div>
</li>

<li id="foli3" class=" ">
<label class="desc" id="title3" for="Field3">
Phone</label>
<div>
<input id="phone" name="phone" type="text" class="field text medium" value="<?php echo $valid_phone; ?>" maxlength="255" tabindex="3" /><span class="err"> <?php echo $error_phone; ?></span>
</div>
</li>

<li id="foli4" class=" ">
<label class="desc" id="title4" for="Field3">
Email </label>
<div>
<input id="email" name="email" type="text" class="field text medium" value="<?php echo $valid_email; ?>" maxlength="255" tabindex="4" /><span class="err"> <?php echo $error_email; ?></span>
</div>
</li>

<li id="foli5" class=" ">
<label class="desc" id="title5" for="Field5">
Year </label>
<div>
<input id="year1" name="year1" type="text" class="field text medium" value="<?php echo $valid_year1; ?>" maxlength="255" tabindex="5" /><span class="err"> <?php echo $error_year1; ?></span>
</div>
</li>

<li id="foli6" class=" ">
<label class="desc" id="title6" for="Field6">
Make </label>
<div>
<input id="make1" name="make1" type="text" class="field text medium" value="<?php echo $valid_make1; ?>" maxlength="255" tabindex="6" /><span class="err"> <?php echo $error_make1; ?></span>
</div>
</li>

<li id="foli7" class=" ">
<label class="desc" id="title7" for="Field7">
Model </label>
<div>
<input id="model1" name="model1" type="text" class="field text medium" value="<?php echo $valid_model1; ?>" maxlength="255" tabindex="7" /><span class="err"> <?php echo $error_model1; ?></span>
</div>
</li>

<li id="foli8" class=" ">
<label class="desc" id="title8" for="Field8">
Vehicle type </label>
<div>
<select id="vehicle_type_id1" name="vehicle_type_id1" class="field select medium" tabindex="8" style="float:left">
<option value="00">Gender</option><option value="1">Male</option><option value="2">Female</option>
</select><span class="err"> <?php echo $error_vehicle_type_id1; ?></span>
</div>
</li>

<li id="foli9" class=" ">
<label class="desc" id="title9" for="Field9">
pickup city</label>
<div>
<input id="pickup_city" name="pickup_city" type="text" class="field text medium" value="<?php echo $valid_pickup_city; ?>" maxlength="255" tabindex="9" /><span class="err"> <?php echo $error_pickup_city; ?></span>
</div>
</li>

<li id="foli10" class=" ">
<label class="desc" id="title10" for="Field10">
pickup state </label>
<div>
<select id="pickup_state_code" name="pickup_state_code" class="field select medium" tabindex="10" style="float:left">
<option value="00">Gender</option><option value="1">Male</option><option value="2">Female</option>
</select><span class="err"> <?php echo $error_pickup_state_code; ?></span>
</div>
</li>

<li id="foli11" class=" ">
<label class="desc" id="title11" for="Field11">
Dropoff City </label>
<div>
<input id="dropoff_city" name="dropoff_city" type="text" class="field text medium" value="<?php echo $valid_dropoff_city; ?>" maxlength="255" tabindex="11" /><span class="err"> <?php echo $error_dropoff_city; ?></span>
</div>
</li>

<li id="foli12" class=" ">
<label class="desc" id="title12" for="Field12">
Dropoff State </label>
<div>
<select id="pickup_state_code" name="pickup_state_code" class="field select medium" tabindex="12" style="float:left">
<option value="00">Gender</option><option value="1">Male</option><option value="2">Female</option>
</select><span class="err"> <?php echo $error_pickup_state_code; ?></span>
</div>
</li>

<li id="foli13" class=" ">
<label class="desc" id="title13" for="Field13">
Runs? </label>
<div>
<select id="vehicle_runs" name="vehicle_runs" class="field select medium" tabindex="13" style="float:left">
<option value="00">Gender</option><option value="1">Male</option><option value="2">Female</option>
</select><span class="err"> <?php echo $error_vehicle_runs; ?></span>
</div>
</li>

<li id="foli14" class=" ">
<label class="desc" id="title14" for="Field14">
Ship Via? </label>
<div>
<select id="ship_via_id" name="ship_via_id" class="field select medium" tabindex="14" style="float:left">
<option value="00">Gender</option><option value="1">Male</option><option value="2">Female</option>
</select><span class="err"> <?php echo $error_ship_via_id; ?></span>
</div>
</li>

<li id="foli15" class=" ">
<label class="desc" id="title15" for="Field15">
Ship Date </label>
<div>
<input id="estimated_ship_date" name="estimated_ship_date" type="text" class="field text medium" value="<?php echo $valid_estimated_ship_date; ?>" maxlength="255" tabindex="15" /><span class="err"> <?php echo $error_estimated_ship_date; ?></span>
</div>
</li>

<li id="foli15" class=" "></li>

<li class="buttons">
<input type="submit" value="Submit" style=" background:#0060a1; color:#FFFFFF; font-size:14px; border:1px solid #0060a1"/>
</li>

</ul>
</form>
<div style="height:20px"></div>
</div>

Join the discussion

Next Topics on Trending Feed

3

Java Script Issue

otfromtot • 14 years ago • 2 replies

My site has a form that has requirements to be submitted, but if javascript is disabled the requirements are no longer required. <input name="estimated_ship_date" type="text" required="required" id="estimated_ship_date" style="width:80px; float:right;" maxlength="10" />