jQuery forms & updating info

  • Resolved elfin

    (@elfin)


    14 years, 2 months ago

    I’m attempting add some ajax to an existing script, all goes well for the first submit, but subsequent ones are not working as expected.

    add_action('wp_head', 'my_special_action_javascript');
add_action('wp_ajax_my_special_action', 'my_special_action_callback');
add_action('wp_ajax_nopriv_my_special_action', 'my_special_action_callback');
add_action('wp_ajax_my_cart', 'my_cart_callback');
add_action('wp_ajax_nopriv_my_cart', 'my_cart_callback');

    and prior to those I also have a wp_enqueue_script('jquery');

    function my_special_action_javascript() {
?>
<script type="text/javascript">
//<![CDATA[
jQuery(document).ready(function() {
	jQuery(".addtocart").submit(function()	{
		var data = {action: 'my_special_action',post:jQuery(this).serialize() };
		jQuery.post("<?php echo admin_url('admin-ajax.php'); ?>", data,
		function(response){
			jQuery(".eshopajax").replaceWith(response);
		});
		function upCart(){
			var tdata = {action: 'my_cart'};
			jQuery.post("<?php echo admin_url('admin-ajax.php'); ?>", tdata,
			function(response){
				jQuery(".ajaxcart").replaceWith(response);
			});
		}
		setTimeout (upCart,500);
		return false;
	});
});
//]]>
</script>
<?php
}

    Notes:
    .addtocart is the class of the form (and there are going to be occasions when there are multiple forms on a page.)
    .eshopax is a section within the form where I am displaying the response (though really I should add this via the script as well).
    .ajaxcart is the cart in the widgets which I am trying to auto update.
    setTimeout – added to slow things down for updating the cart, to allow the first process to finish.

    Now as explained the above works, once. But when I submit the form again, even with different values it no longer updates the cart, or the message in the form – yet the relevant callback function has been called as when I visit the standard cart page the info has been updated!

    So how do I reset things for it to recognise possible new form details? Additionally I don’t think the jQuery.post in the upCart function is correct either (but it does work…).

    any help appreciated.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter elfin

    (@elfin)

    ahh nvm, evntually sorted it:

    jQuery(document).ready(function($){
    $('.addtocart').submit(function(){
    	var data = {action: 'my_special_action',post:$('.addtocart').serialize() };
		$.post("<?php echo admin_url('admin-ajax.php'); ?>", data,
		function(response){
			$(".eshopajax").insertAfter(this).fadeIn(100).html(response).fadeOut(3000);
			setTimeout (clearCart,200);
			setTimeout (doRequest,500);
			setTimeout (clearRequest,3000);
		});
		function doRequest(){
			var tdata = {action: 'my_cart'};
			$.post("<?php echo admin_url('admin-ajax.php'); ?>", tdata,
			function(response){
				$(".ajaxcart").insertAfter(this).fadeIn(100).html(response);
			});
		}
		function clearRequest(){
			$(".eshopajax").empty();
		}
		function clearCart(){
			$(".ajaxcart").insert();
		}
		return false;
	});

});

    Thread Starter elfin

    (@elfin)

    and even got it to work with multiple forms on a single page.

    But I guess I’m talking to myself…

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘jQuery forms & updating info’ is closed to new replies.

Tags