Jquery breaking in all IE browsers.

Here is my code; this works fine with no errors in firefox. all the jquery include files are taken from jquery.com
All IE browsers doesn't validate the jquery and rather gives a javascript errror.
[code]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
 <head>
 <title>Simple Form Validation</title>
 <script type="text/javascript" src="jquery.js"></script>
 <script type="text/javascript" src="jquery.validate.js"></script>

 <script type="text/javascript">
 jQuery.validator.addMethod("phoneUS", function(phone_number, element) {
 phone_number = phone_number.replace(/\s+/g, ""); 
 return this.optional(element) || phone_number.length > 9 &&
 phone_number.match(/^(1-?)?(\([2-9]\d{2}\)|[2-9]\d{2})-?[2-9]\d{2}-?\d{4}$/);
}, "Please specify a valid phone number");

 
 
 $(document).ready(function() {
 $("#form1").validate({
 rules: {
 firstName: "required",// simple rule, converted to {required:true}
 lastName: "required",
 email: {// compound rule
 required: true,
 email: true,
 remote: "checkAddress.php"
 }, 
 password: "required",
 verify: {
 equalTo: "#password"
 },
 address1: "required",
 city: "required",
 province: "required",
 postal: "required",
 phone: {
 required: true,
 phoneUS: true
 },
 dob: {
 required: true,
 date: true
 },
 
 
 captcha_code: {
 required: true,
 captcha_code: true,
 remote: "checkCaptcha.php" 
 }, 
 
 },
 messages: {
 email:{
 remote: "This email is already registered! One registration per email address."
 },
 captcha_code:{
 remote: "Enter the right captcha value!."
 }

 },

 });
 });
 </script>

 <style type="text/css">
 * { font-family: Verdana; font-size: 11px; line-height: 14px; }
 .submit { margin-left: 125px; margin-top: 10px;}
 .label { display: block; float: left; width: 120px; text-align: right; margin-right: 5px; }
 .form-row { padding: 5px 0; clear: both; width: 700px; }
 label.error { width: 250px; display: block; float: left; color: red; padding-left: 10px; }
 input[type=text], textarea { width: 250px; float: left; }
 textarea { height: 50px; }
 </style>
 </head>

 <body>
 <form id="form1" method="post" action="<?php print $_SERVER['PHP_SELF']; ?>">
 <div class="form-row"><input type="text" name="firstName" size="30"/><span class="label">First Name *</span></div>
 <div class="form-row"><input type="text" name="lastName" size="30"/><span class="label">Last Name *</span></div>
 <div class="form-row"><input type="text" remote="checkAddress.php" name="email" /><span class="label">E-Mail *</span></div>
 <div class="form-row"><input type="password" name="password" /><span class="label">Password</span></div>
 <div class="form-row"><input type="password" name="verify" /><span class="label">Verify Password</span></div>
 
 <div class="form-row"><input type="text" name="address1" /><span class="label">Address 1 *</span></div>
 <div class="form-row"><input type="text" name="address2" /><span class="label">Address 2*</span></div>
 
 
 <div class="form-row"><input type="text" name="dob" /><span class="label">Date of Birth *</span></div>
 
 
 
 
 
 <div class="form-row"><span class="label">
 <img id="captcha" src="securimage/securimage_show.php" alt="CAPTCHA Image" />
 <input type="text" remote="checkCaptcha.php" name="captcha_code" size="6" maxlength="6" />
 <a href="#" onclick="document.getElementById('captcha').src = 'securimage/securimage_show.php?' + Math.random(); return false">Reload Image</a>
 </div> 
 <div class="form-row"><input type="submit" value="submit" name="submit"></div>
 </form>
 </body>
</html>
[/code]
Topic Participants
ajpiano
Jquery breaking in all IE browsers.

Jquery breaking in all IE browsers.

Topic Participants

ajpiano
