| Sam Granger |
04-29-2009 03:21 AM |
2 or more forms don't want to play along nicely..
Right, I have an ajax cart and this is my problem. I have a form that submits an id through AJAX. This form is recognised through its class form. See the JS below. Anyway, this works fine for 1 form with class value form, but once there are more than 1 product/form it breaks - the first form will only submit, if i submit other forms, the first one is submitted still.
PHP Code:
<?php
require_once( '../config.php' );
?>
$(document).ready(function(){
var inputId = $("#product_id");
var inputAmount = $("#product_amount");
var loading = $("#loading");
var cartContent = $(".box > ul");
function updateCart(){
cartContent.hide();
loading.fadeIn();
$.ajax({
type: "POST", url: "<?php echo ROOT_URL; ?>index.php?act=cart", data: "&action=update",
complete: function(data){
loading.fadeOut();
cartContent.html(data.responseText);
cartContent.fadeIn(2000);
}
});
}
function checkForm(){
if(inputId.attr("value") && inputAmount.attr("value"))
return true;
else
return false;
}
updateCart();
$(".form").submit(function(){
if(checkForm()){
var id = inputId.attr("value");
var amount = inputAmount.attr("value");
$(".send").attr({ disabled:true, value:"Sending..." });
$(".send").blur();
$.ajax({
type: "POST", url: "<?php echo ROOT_URL; ?>index.php?act=cart", data: "&action=insert&product_id=" + id + "&product_amount=" + amount,
complete: function(data){
cartContent.html(data.responseText);
updateCart();
$(".send").attr({ disabled:false, value:"Add to cart" });
}
});
}
else alert("Please fill all fields!");
return false;
});
});
How could I get this JS to accept more than 1 form? And what would I have to change in my HTML/call?
Thanks for looking! |
