views:

146

answers:

1

Hi! My simple donation form submits properly except for Internet Explorer. I'm sure it has to do with issues with change() and focus() or blur(), but all my hundreds of attempts so far have failed me. I tried using .click() instead of change() as mentioned in this post:http://stackoverflow.com/questions/208471/getting-jquery-to-recognise-change-in-ie (and elsewhere), but I could not get it to work! ... so I am overlooking something simple perhaps. Any help is greatly appreciated!!

Here is the link to the page: http://www.wsda.org/donate

HTML FORM:

<form id="donationForm" method="post" action="https://wsda.foxycart.com/cart.php" class="foxycart">
<input type="hidden" id="name" name="name" value="Donation" />
<input type="hidden" id="price" name="price" value="10" />
<div class="row">
 <label for="price_select">How much would you like to donate?</label>
 <select id="price_select" name="price_select">  
                <option value="10">$10</option>
  <option value="20">$20</option>
  <option value="50">$50</option>
  <option value="100">$100</option>
  <option value="300">$300</option>
  <option value="0">Other</option>
 </select>
</div>
<div class="row" id="custom_amount">
 <label for="price_input">Please enter an amount: $</label>
 <input type="text" id="price_input" name="price_select" value="" />
</div>
<input type="submit" id="DonateBtn" value="Submit Donation »" />
</form>

JQUERY:

// donation form
$("#custom_amount").hide();
$("#price_select").change(function(){
   if ($("#price_select").val() == "0") {
      $("#custom_amount").show();
   } else {
      $("#custom_amount").hide();
   }
   $("#price").val($("#price_select").val());
});

$("#price_input").change(function(){
   $("#price").val($("#price_input").val());
});
A: 

Using one of the answers given from this post: http://stackoverflow.com/questions/208471/getting-jquery-to-recognise-change-in-ie - I revised my script to the following, and now it works great!!

New Script that WORKS!:

// donation form
$("#custom_amount").hide();
$("#price_select").change(function(){
   if ($("#price_select").val() == "0") {
      $("#custom_amount").show();
   } else {
      $("#custom_amount").hide();
   }
   $("#price").val($("#price_select").val());
});

if ($.browser.msie) {
  $("#price_input").click(function() {
    this.blur();
    this.focus();
  });
};

$("#price_input").change(function(){
   $("#price").val($("#price_input").val());
});
VUELA