I'm tearing my hair out trying to figure out what's causing a conflict in my code ... everything works perfectly in Firefox, but, as usual, IE is totally busted. I've been trying to spot it for weeks and I JUST. CAN'T. FIND. IT.
Can someone lend a helping hand? FYI, the complete page is here:
http://mysarasotashortsale.com/test/
<div class="sos_wrap">
<div id="sos_form">
<div id="sos_form_div1">
<h3 style="text-align:right; margin-right:20px">STEP ONE</h3>
<div class="sos_button" id="sos_div1_button">
<h4>GO TO STEP 2 »</h4>
</div>
<table width="690px">
[ ... lots of boring stuff :) ]
</table></td>
</tr>
</table>
</div>
<div id="sos_form_div2">
<h3 style="text-align:right; margin-right:20px">STEP TWO</h3>
<div class="sos_button" onClick="javascript:jQuery(this).submit();">
<h4>SUBMIT</h4>
</div>
<table width="690px">
[ ... lots of boring stuff :) ]
</table>
</div>
</div>
</div>
<script>
function notEmpty(elem, helperMsg){
if(elem.value.length == 0){
alert(helperMsg);
elem.focus(); // set the focus to this input
return false;
}
return true;
}
</script>
<script>
jQuery("#sos_div1_button").click(function(){
if(notEmpty(document.getElementById('PropertyAddress'),'Address is a required field.')){
if(notEmpty(document.getElementById('PropertyCity'),'City is a required field.')){
if(notEmpty(document.getElementById('PropertyState'),'State is a required field.')){
if(notEmpty(document.getElementById('PropertyZip'),'ZIP code is required.')){
jQuery("#sos_form_div1,#sos_form_div2").animate({left:"-=100%"}, "slow");
}}}}});
</script>
