Hi,
I have a small piece of code that is causing some odd behaviour in FF 2 and 3 (Win & Mac) but not in other browsers (IE6 & 7, Safari 3 are the ones I’ve tested).
The code inspects a text input and on each keyup issues an Ajax
request. The target PHP file checks whether the input matches a string
and if so the jQuery code then disables the text input field, scans
the page for PayPal add to basket buttons (normally 7 of them) generated by Simple Commerce and
adjusts each form hidden field amount and button text by 2 pounds (the
forms are not encrypted). This is for a discount code.
This all seems to work very well on every browser I’ve got immediate
access to but not FF 3 (Mac) or FF 2 (Win). On these browsers the
changes to the hidden fields persist across page reloads so if I input
the correct code then refresh the page and input the correct code
again then the form fields and buttons will be adjusted by 4 pounds
and not just two. This behaviour will continue as many times as I can
be bothered to refresh and reenter the correct code. What’s
particularly odd is the button values are reset to the originals after
each page refresh, just not the hidden fields amounts.
I’ve no doubt that this is down to me a) not understanding how the DOM
really works and b) not really understanding how jQuery works and c)
writing crappy code. However, I’d really appreciate some guidance and
explanation. I’m using jquery-1.2.6 minified. My code is:
$(document).ready(function(){
// reset the discount input
$('#discountCode').attr('disabled', '').val('');
$('#discountCode').keyup(function() {
var inputValue = $('#discountCode').val();
$.get('/assets/data/discount.php', {code: inputValue},
function(data) {
if (data == 'true')
{
// if code is correct we disable the input
$('#discountCode').attr('disabled', 'disabled');
// and show the tick mark
$('#correctCode').css('display', 'inline');
// get each hidden input amount
$("#main form input[name='amount']").each(function() {
var originalCost = $(this).val();
// apply the discount
var discountCost = originalCost - 2;
// set the discount in the hidden amount fields
$(this).val(discountCost);
// Change the button text
var newButtonText = '£'+discountCost+' Add to basket';
$(this).parent().next('.paypal_button').val(newButtonText);
// reset variables
originalCost = 0;
discountCost = 0;
});
};
});
});
});The Paypal forms are standard SC generated ones. I suspect I’m being really stupid but I can’t figure it out. What am I doing wrong here?
Cheers
Dry