jquery validation (safari will not submit)
Hello I am using jquery validation and I cannot make my form submit in Safari. Works in all others.
Everything else I have in the submit handler works except for form.submit();
Everything else I have in the submit handler works except for form.submit();
//validate account info
$("#account_info").validate( {
errorPlacement: function (error, element) { //puts the error message beside the label
$('#'+element.attr("id")+'_label').append(error);
},
rules: {
profile_2: { profileNotEqualTo: "#profile_1"}, //profile 1 cannot be equal to profile 2
re_enter_email: { equalTo: "#contact_email"}
},
messages: { // custom messages
county_ansi: "Setting your location is required. Please enter a city or zip code to search.",
re_enter_email: "Does not match"
},
submitHandler: function(form) { //submits form and hide button shows loading
$("#button_box").hide();
blinkInfoLoadingBox();
form.submit();
}
});
Rob
it may also be your html causing the issue, can you please supple the form html?
ASKER
Pretty long form
<form name="account_info" id="account_info" method="POST" action="<?php echo $editFormAction; ?>">
<!------------------------------------------------------------------------------------------------------------------------------>
<!--information for personal account -- note prob add candidate to this -->
<?php if ($acct_type=="PER"){ ?>
<?php if (isset($_GET['existing_email'])){ //if new email address fails on personal account ?>
<div class="grid_14 push_1 alpha margin_top_10 arial_14 color_red">
There is an account aready associated with that email address.
</div>
<div class="clear"></div>
<?php }?>
<div class="grid_7 push_1 alpha margin_top_10">
<div>
<label for="first_name" id="first_name_label" class="arial_13"><span class="color_red">*</span> First Name:</label>
</div>
<div>
<input name="first_name" type="text" class="text_field required" id="first_name" value="<?php echo $row_use_as['act_first_name']; ?>" size="30" maxlength="100"/>
</div>
</div>
<div class="grid_7 push_1 margin_top_10">
<div>
<label for="last_name" id="last_name_label" class="arial_13"><span class="color_red">*</span> Last Name:</label>
</div>
<div>
<input name="last_name" type="text" class="text_field required" id="last_name" value="<?php echo $row_use_as['act_last_name']; ?>" size="30" maxlength="100"/>
</div>
</div>
<div class="clear"></div>
<?php if ($info_validate == "pass"){ //This is so it will not show on the initial sign up - only shows on edit account info ?>
<div class="grid_7 push_1 alpha margin_top_10">
<div><label for="contact_email" id="contact_email_label" class="arial_13">Login Email:</label></div>
<div>
<input name="contact_email" type="text" class="text_field required" id="contact_email" size="30" maxlength="100" value="<?php echo $row_use_as['act_email']; ?>"/>
</div>
</div>
<div class="grid_7 push_1 margin_top_10">
<div><label for="re_enter_email" id="re_enter_email_label" class="arial_13">Re-enter Email:</label></div>
<div><input name="re_enter_email" type="text" class="text_field" id="re_enter_email" size="30" maxlength="100" value="<?php echo $row_use_as['act_email']; ?>"/></div>
</div>
<div class="clear"></div>
<div class="grid_7 push_1 alpha">
<div><label for="password" id="password_label" class="arial_13">Password:</label></div>
<div>
<input name="password" type="password" class="text_field required" id="password" size="30" maxlength="20" value="<?php echo $row_master_account['mst_password']; ?>"/>
</div>
</div>
<div class="clear"></div>
<input name="info_master_id" type="hidden" value="<?php echo $row_master_account['mst_id']; ?>">
<input name="hold_contact_email" type="hidden" value="<?php echo $row_use_as['act_email']; ?>">
<?php }?>
<?php if ($info_validate == "fail"){ //This is to not lose the email address on initial sign up ?>
<input name="contact_email" type="hidden" value="<?php echo $row_use_as['act_email']; ?>">
<input name="hold_contact_email" type="hidden" value="<?php echo $row_use_as['act_email']; ?>">
<?php }?>
<?php }?>
<!------------------------------------------------------------------------------------------------------------------------------>
<!--information for business and orgs -->
<?php if ($acct_type=="BIZ" or $acct_type=="ORG"){ ?>
<div class="grid_7 push_1 alpha margin_top_10">
<div>
<?php if ($acct_type=="BIZ"){ ?>
<label for="name" id="name_label" class="arial_13"><span class="color_red">*</span> Company Name:</label>
<?php }?>
<?php if ($acct_type=="ORG"){ ?>
<label for="name" id="name_label" class="arial_13"><span class="color_red">*</span> Organization Name:</label>
<?php }?>
</div>
<div>
<input name="name" type="text" class="text_field required" id="name" value="<?php echo $row_use_as['act_name']; ?>" size="30" maxlength="100"/>
</div>
</div>
<div class="grid_7 push_1 margin_top_10">
<div>
<label for="contact_email" id="contact_email_label" class="arial_13"><span class="color_red">*</span> Contact Email:</label>
</div>
<div>
<input name="contact_email" type="text" class="text_field required" id="contact_email" value="<?php echo $row_use_as['act_email']; ?>" size="30" maxlength="100"/>
</div>
</div>
<div class="clear"></div>
<div class="grid_7 push_1 alpha margin_top_10">
<div>
<label for="phone" id="phone_label" class="arial_13"><span class="color_red">*</span> Phone:</label>
</div>
<div>
<input name="phone" type="text" class="text_field required" id="phone" value="<?php echo $row_use_as['act_phone']; ?>" size="30" maxlength="100"/>
</div>
</div>
<div class="grid_7 push_1 margin_top_10">
<div>
<label for="address" id="address_label" class="arial_13"><span class="color_red">*</span> Address:</label>
</div>
<div>
<input name="address" type="text" class="text_field required" id="address" value="<?php echo $row_use_as['act_address']; ?>" size="30" maxlength="100"/>
</div>
</div>
<div class="clear"></div>
<div class="grid_7 push_1 alpha margin_top_10">
<div>
<label for="address_city" id="address_city_label" class="arial_13"><span class="color_red">*</span> City:</label>
</div>
<div>
<input name="address_city" type="text" class="text_field required" id="address_city" value="<?php echo $row_use_as['act_address_city']; ?>" size="30" maxlength="100"/>
</div>
</div>
<div class="grid_7 push_1 margin_top_10">
<div>
<label for="address_state" id="address_state_label" class="arial_13"><span class="color_red">*</span> State:</label>
</div>
<div>
<select name="address_state" class="text_field required" id="address_state">
<?php if ($row_use_as['act_address_state']){ ?>
<option value="<?php echo $row_use_as['act_address_state']; ?>" selected="selected"><?php echo $row_use_as['act_address_state']; ?></option>
<?php }?>
<?php if (!$row_use_as['act_address_state']){ ?>
<option value="" selected="selected"></option>
<?php }?>
<?php do { ?>
<option value="<?php echo $row_states['sta_abbreviation']?>"><?php echo $row_states['sta_name']?></option>
<?php }
while ($row_states = mysql_fetch_assoc($states));
$rows = mysql_num_rows($states);
if($rows > 0) {
mysql_data_seek($states, 0);
$row_states = mysql_fetch_assoc($states);
}
?>
</select>
</div>
</div>
<div class="clear"></div>
<div class="grid_7 push_1 alpha margin_top_10">
<div>
<label for="address_zip" id="address_zip_label" class="arial_13"><span class="color_red">*</span> Zip Code:</label>
</div>
<div>
<input name="address_zip" type="text" class="text_field required" id="address_zip" value="<?php echo $row_use_as['act_address_zip']; ?>" size="30" maxlength="100"/>
</div>
</div>
<div class="grid_7 push_1 margin_top_10">
<div>
<label for="website" id="website_label" class="arial_13">Website:</label>
</div>
<div>
<input name="website" type="text" class="text_field" id="website" value="<?php echo $row_use_as['act_website']; ?>" size="30" maxlength="100"/>
</div>
</div>
<div class="clear"></div>
<?php if ($acct_type=="BIZ"){ ?>
<div class="grid_7 alpha push_1 margin_top_10">
<div>
<label for="biz_type" id="biz_type_label" class="arial_13"><span class="color_red">*</span> Business Type:</label>
</div>
<div>
<select name="biz_type" class="text_field required" id="biz_type" onchange="bizType(this.value);" >
<?php if ($row_use_as['act_biz_type']){ ?>
<option value="<?php echo $row_use_as['act_biz_type']; ?>" selected="selected"><?php echo $row_biz_type_selected['btp_description']; ?></option>
<?php }?>
<?php if (!$row_use_as['act_biz_type']){ ?>
<option value="" selected="selected"></option>
<?php }?>
<?php do { ?>
<option value="<?php echo $row_biz_types['btp_type']?>"><?php echo $row_biz_types['btp_description']?></option>
<?php }
while ($row_biz_types = mysql_fetch_assoc($biz_types));
$rows = mysql_num_rows($biz_types);
if($rows > 0) {
mysql_data_seek($biz_types, 0);
$row_biz_types = mysql_fetch_assoc($biz_types);
}
?>
</select>
</div>
</div>
<?php }?>
<div class="clear"></div>
<div id="profile_1_box" class="grid_14 push_1 alpha margin_top_10">
<div>
<label for="profile_1" id="profile_1_label" class="arial_13"><span class="color_red">*</span> Directory Category:</label>
</div>
<div>
<?php if ($acct_type=="ORG"){ ?>
<input name="profile_1" type="hidden" value="ORGA">
<?php }?>
<?php if ($acct_type!="ORG"){ ?>
<select name="profile_1" class="text_field" id="profile_1" onchange="profileCheck1(this.value);">
<option value=""></option>
<?php if ($row_use_as['act_profile_1']){ ?>
<option value="<?php echo $row_use_as['act_profile_1']; ?>" selected="selected"><?php echo $row_profile_1_selected['pro_typ_description']; ?></option>
<?php }?>
<?php do { ?>
<option value="<?php echo $row_profile_types['pro_typ_type']?>"><?php echo $row_profile_types['pro_typ_description']?></option>
<?php }
while ($row_profile_types = mysql_fetch_assoc($profile_types));
$rows = mysql_num_rows($profile_types);
if($rows > 0) {
mysql_data_seek($profile_types, 0);
$row_profile_types = mysql_fetch_assoc($profile_types);
}
?>
</select>
<?php }?>
</div>
</div>
<div class="clear"></div>
<div id="profile_2_box" class="grid_14 push_1 alpha margin_top_10">
<div>
<label for="profile_2" id="profile_2_label" class="arial_13">Additional Directory Category:</label>
</div>
<div>
<select name="profile_2" class="text_field" id="profile_2" onchange="profileCheck2(this.value);">
<option value=""></option>
<?php if ($row_use_as['act_profile_2']){ ?>
<option value="<?php echo $row_use_as['act_profile_2']; ?>" selected="selected"><?php echo $row_profile_2_selected['pro_typ_description']; ?></option>
<?php }?>
<?php do { ?>
<option value="<?php echo $row_profile_types['pro_typ_type']?>"><?php echo $row_profile_types['pro_typ_description']?></option>
<?php }
while ($row_profile_types = mysql_fetch_assoc($profile_types));
$rows = mysql_num_rows($profile_types);
if($rows > 0) {
mysql_data_seek($profile_types, 0);
$row_profile_types = mysql_fetch_assoc($profile_types);
}
?>
</select>
</div>
</div>
<div class="clear"></div>
<div id="restaurant_type_box" class="grid_12 push_1 alpha margin_top_10">
<div>
<label for="restaurant_type" id="restaurant_type_label" class="arial_13"><span class="color_red">*</span> Restaurant Type:</label>
</div>
<div>
<select name="restaurant_type" class="text_field" id="restaurant_type">
<option value=""></option>
<?php if ($row_use_as['act_rest_type']){ ?>
<option value="<?php echo $row_use_as['act_rest_type']; ?>" selected="selected"><?php echo $row_rest_type_selected['res_typ_description']; ?></option>
<?php }?>
<?php do { ?>
<option value="<?php echo $row_restaurant_types['res_type']?>"><?php echo $row_restaurant_types['res_typ_description']?></option>
<?php }
while ($row_restaurant_types = mysql_fetch_assoc($restaurant_types));
$rows = mysql_num_rows($restaurant_types);
if($rows > 0) {
mysql_data_seek($restaurant_types, 0);
$row_restaurant_types = mysql_fetch_assoc($restaurant_types);
}
?>
</select>
</div>
</div>
<div class="clear"></div>
<div id="medical_type_box" class="grid_12 push_1 alpha margin_top_10">
<div>
<label for="medical_type" id="medical_type_label" class="arial_13"><span class="color_red">*</span> Health Care Type:</label>
</div>
<div>
<select name="medical_type" class="text_field" id="medical_type" onchange="medType(this.value);" >
<option value=""></option>
<?php if ($row_use_as['act_medi_type']){ ?>
<option value="<?php echo $row_use_as['act_medi_type']; ?>" selected="selected"><?php echo $row_medi_type_selected['med_type_description']; ?></option>
<?php }?>
<?php do { ?>
<option value="<?php echo $row_medical_types['med_type']?>"><?php echo $row_medical_types['med_type_description']?></option>
<?php }
while ($row_medical_types = mysql_fetch_assoc($medical_types));
$rows = mysql_num_rows($medical_types);
if($rows > 0) {
mysql_data_seek($medical_types, 0);
$row_medical_types = mysql_fetch_assoc($medical_types);
}
?>
</select>
</div>
</div>
<div class="clear"></div>
<div id="dentist_type_box" class="grid_12 push_1 alpha margin_top_10">
<div>
<label for="dentist_type" id="dentist_type_label" class="arial_13"><span class="color_red">*</span> Dentist Type:</label>
</div>
<div>
<select name="dentist_type" class="text_field" id="dentist_type">
<option value=""></option>
<?php if ($row_use_as['act_dentist_type']){ ?>
<option value="<?php echo $row_use_as['act_dentist_type']; ?>" selected="selected"><?php echo $row_dent_type_selected['den_typ_description']; ?></option>
<?php }?>
<?php do { ?>
<option value="<?php echo $row_dentist_types['den_type']?>"><?php echo $row_dentist_types['den_typ_description']?></option>
<?php }
while ($row_dentist_types = mysql_fetch_assoc($dentist_types));
$rows = mysql_num_rows($dentist_types);
if($rows > 0) {
mysql_data_seek($dentist_types, 0);
$row_dentist_types = mysql_fetch_assoc($dentist_types);
}
?>
</select>
</div>
</div>
<div class="clear"></div>
<div id="doctor_type_box" class="grid_12 push_1 alpha margin_top_10">
<div>
<label for="doctor_type" id="doctor_type_label" class="arial_13"><span class="color_red">*</span> Doctor Type:</label>
</div>
<div>
<select name="doctor_type" class="text_field" id="doctor_type">
<option value=""></option>
<?php if ($row_use_as['act_doctor_type']){ ?>
<option value="<?php echo $row_use_as['act_doctor_type']; ?>" selected="selected"><?php echo $row_doct_type_selected['doc_typ_description']; ?></option>
<?php }?>
<?php do { ?>
<option value="<?php echo $row_doctor_types['doc_type']?>"><?php echo $row_doctor_types['doc_typ_description']?></option>
<?php }
while ($row_doctor_types = mysql_fetch_assoc($doctor_types));
$rows = mysql_num_rows($doctor_types);
if($rows > 0) {
mysql_data_seek($doctor_types, 0);
$row_doctor_types = mysql_fetch_assoc($doctor_types);
}
?>
</select>
</div>
</div>
<div class="clear"></div>
<div id="eye_type_box" class="grid_12 push_1 alpha margin_top_10">
<div>
<label for="eye_type" id="eye_type_label" class="arial_13"><span class="color_red">*</span> Eye Care Type:</label>
</div>
<div>
<select name="eye_type" class="text_field" id="eye_type">
<option value=""></option>
<?php if ($row_use_as['act_eye_type']){ ?>
<option value="<?php echo $row_use_as['act_eye_type']; ?>" selected="selected"><?php echo $row_eye_type_selected['eye_typ_description']; ?></option>
<?php }?>
<?php do { ?>
<option value="<?php echo $row_eye_types['eye_type']?>"><?php echo $row_eye_types['eye_typ_description']?></option>
<?php }
while ($row_eye_types = mysql_fetch_assoc($eye_types));
$rows = mysql_num_rows($eye_types);
if($rows > 0) {
mysql_data_seek($eye_types, 0);
$row_eye_types = mysql_fetch_assoc($eye_types);
}
?>
</select>
</div>
</div>
<div class="clear"></div>
<?php }?>
<!------------------------------------------------------------------------------------------------------------------------------>
<!--Location -- this is for all accounts to set their location -->
<div class="grid_16 push_1 alpha pad_btm_5"><label for="account_location" class="arial_13"><span class="color_red">*</span> Find your WebCahoot location with the box below. </label></div>
<div class="grid_16 push_1 alpha"></div>
<div class="grid_7 alpha push_1"><input name="account_location" type="text" class="text_field color_5" id="account_location" size="30" maxlength="100" onblur="javascript:fillLoc();" onfocus="javascript:clearLoc();" onkeyup="javascript:myLocation();" value="Enter a city or zip code to search"/>
</div><div id="searching" class="grid_3 push_1 alpha"></div>
<input name="city_name" type="hidden" value="<?php echo $row_use_as['act_city_name']; ?>">
<input name="state_name" type="hidden" value="<?php echo $row_use_as['act_state_name']; ?>">
<input name="county_name" type="hidden" value="<?php echo $row_use_as['act_county_name']; ?>">
<input name="area_type" type="hidden" value="<?php echo $row_use_as['act_area_type']; ?>">
<input name="county_ansi" type="hidden" id="county_ansi" class="required" value="<?php echo $row_use_as['act_county_ansi']; ?>">
<input name="state_ansi" type="hidden" value="<?php echo $row_use_as['act_state_ansi']; ?>">
<div id="location_selected" class="grid_16 push_1 alpha arial_14">
<?php if ($row_use_as['act_city_name'] and $row_use_as['act_state_name'] and $row_use_as['act_county_ansi'] and $row_use_as['act_state_ansi']){
echo "Set My Location as ".$row_use_as['act_city_name'].", ".$row_use_as['act_state_name']." - ".$row_use_as['act_county_name']." ".$row_use_as['act_area_type'];
}
?>
<label for="county_ansi" id="county_ansi_label" class="arial_13"></label>
</div>
<div id="location_search" class="grid_16 push_1 alpha arial_13"></div>
<div class="clear"></div>
<!------------------------------------------------------------------------------------------------------------------------------>
<!--Submit and account id information -->
<div id="button_box" class="grid_7 alpha push_1 margin_top_20">
<input name="submit" type="submit" value="Submit" class="button_large" id="submit" onclick="javascript:stopSearching();">
</div>
<div id="loading_box" class="grid_7 push_1 margin_top_20 loading">Loading....</div>
<div class="clear"></div>
<input type="hidden" name="MM_update" value="account_info">
<input type="hidden" name="account_id" value="<?php echo $row_use_as['act_id']; ?>">
</form>
</div> <!--end #acct_info -->
There are issues with your html that safari may not like, especially number three:
1) Line 20, Column 71: Bad value for attribute action on element form: Must be non-empty.
<form name="account_info" id="account_info" method="POST" action="">
2) Line 88, Column 8: Stray end tag div.
</div> <!-- end #acct_info -->
3) Line 60, Column 78: The for attribute of the label element must refer to a form control.
… <label for="county_ansi" id="county_ansi_label" class="arial_13"></label>
1) Line 20, Column 71: Bad value for attribute action on element form: Must be non-empty.
<form name="account_info" id="account_info" method="POST" action="">
2) Line 88, Column 8: Stray end tag div.
</div> <!-- end #acct_info -->
3) Line 60, Column 78: The for attribute of the label element must refer to a form control.
… <label for="county_ansi" id="county_ansi_label" class="arial_13"></label>
What doctype are you using for the site? html5 doesn't like consecutive dashes in comments
ie
<!------------------------
should be (and note spaces):
<!-- ==========================
ie
<!------------------------
should be (and note spaces):
<!-- ==========================
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.