How to create add to cart with AJAX on single and variable products programmatically

  • 5 years-11 months

    How to create add to cart with AJAX on single and variable products programmatically

    • Category : wordpress
    • Viewed : 37 times
    • Posted On :
    • Posted by : Vikas

    default WooCommerce if the user clicks on the add to cart button, that item is added to the cart. if you want to add custom add to cart button please remove default "add to cart" button

    // custom template
    <button type="submit" class="custom_cart_button">add to cart</button>
    <script type="text/javascript">
    jQuery(document).ready(function() {
    var ajaxurl = '<?php echo admin_url('admin-ajax.php'); ?>';
        jQuery('.custom_cart_button').submit(function(e) {
            jQuery.ajax({
                url: ajaxurl,
                type: "post",
                data: {				
    		action : 'post_product_variations19'
    	    },
                success: function(data) {   
                	console.log(data);
                }
            });
    	return false;
        });
    });
    </script>
    
    
    // function.php
    add_action( 'wp_ajax_nopriv_post_product_variations19', 'post_product_variations_func19' );
    add_action( 'wp_ajax_post_product_variations19', 'post_product_variations_func19' );
    function post_product_variations_func19() {
    
        global $woocommerce;
    
        $product_id = 364; // your product id
    
        $found = false;
    
        //check if product already in cart
        if ( sizeof( $woocommerce->cart->get_cart() ) > 0 ) {
            foreach ($woocommerce->cart->get_cart() as $cart_item_key => $values ) {
                $_product = $values['data'];
                if ( $_product->id == $product_id ) {
                	//$calc_qty = $values['quantity'] < 1 ? 1 : $values['quantity']+1;
                	//$woocommerce->cart->set_quantity( $cart_item_key, $calc_qty, true );
                    $found = true;
                }
            }
            // if product not found, add it
            //if ( ! $found )
                $woocommerce->cart->add_to_cart( $product_id );
        } else {
            // if no products in cart, add it
            $woocommerce->cart->add_to_cart( $product_id );
        }
    	
    wp_die();
    }

Report this or Ask your own question

Your Answer

When answering a question please:
  1. Read the question carefully.
  2. Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
  3. If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Let's work to help developers, not make them feel stupid.