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());
});