Ajax and Multiple forms on a single page
Ok So I have 3 forms on a page, they each get submited by themselves and do some kind of animation update. For some reason everytime you submit a form it builds a loop somewhere. So if I submit 1 form twice, it displays the animation twice, then if I submit another form on the same page, it displays both animations. It only does this after submiting each form. It kind of per say builds. Its like an array is being added to and then runs through the entire array but I have no idea where, what it is or how to unset it.
here is the code: Do I need to somehow reset the $.ajax?
-
<script type="text/javascript">
jQuery(document).ready(function(){
$(document).pngFix();
// ------- Submit Subscribe Form -------
$("#subscribe").submit(function(){
var str = $(this).serialize();
$.ajax({
type: "POST",
url: "includes/ajax-contact.php",
data: str,
success: function(msg){
$("#subnote").ajaxComplete(function(event, request, settings){
if(msg == 'OK-1') // Message Sent? Show the 'Thank You' message and hide the form
{
result = '<div class="notification_ok">Successfully Added!</div>';
$("#signupForm").hide();
}
else
{
result = msg;
}
$(this).html(result).fadeIn('slow').animate({opacity: 1.0}, 3000).fadeOut('slow');
$("#signupForm").animate({opacity: 1.0}, 4000).fadeIn('slow');
$("#subscribe")[0].reset();
});
}
});
return false;
});
// ------- Submit Tagging Form -------
$("#tag").submit(function(){
var str = $(this).serialize();
$.ajax({
type: "POST",
url: "includes/ajax-contact.php",
data: str,
success: function(msg){
$("#tagnote").ajaxComplete(function(event, request, settings){
if(msg == 'OK-2') // Message Sent? Show the 'Thank You' message and hide the form
{
result = '<div class="notification_ok">Successfully Tagged!</div>';
$("#tagContainer").hide();
}
else
{
result = msg;
}
$(this).html(result).fadeIn('slow').animate({opacity: 1.0}, 3000).fadeOut('slow');
$("#tagContainer").animate({opacity: 1.0}, 4000).fadeIn('slow');
$("#tag")[0].reset();
});
}
});
return false;
});
// ------- Submit Contact Form -------
$("#contact").submit(function(){
var str = $(this).serialize();
$.ajax({
type: "POST",
url: "includes/ajax-contact.php",
data: str,
success: function(msg){
$("#note").ajaxComplete(function(event, request, settings){
if(msg == 'OK-3') // Message Sent? Show the 'Thank You' message and hide the form
{
result = '<div class="notification_ok">Your question has been sent. Thank you!</div>';
$("#contactContainer").hide();
}
else
{
result = msg;
}
$(this).html(result).fadeIn('slow').animate({opacity: 1.0}, 3000).fadeOut('slow');
$("#contactContainer").animate({opacity: 1.0}, 4000).fadeIn('slow');
$("#contact")[0].reset();
});
}
});
return false;
});
$('#imgrotation').cycle({
fx: 'fade',
pause: 1,
timeout: 6000,
speed: 3500
});
$('a#reprint-toggle').click(function() {
$('#displayReprints').toggle(600);
return false;
});
});
</script>