如何仅使用ajax

时间:2019-05-14 05:26:41

标签: php wordpress woocommerce hook-woocommerce

我想立即在购物车中添加产品包装。例如,我有3个产品A, B and C。现在,我想一次将这些产品作为产品包添加到购物车中。

因此,一旦将其添加到购物车中,它只会显示不想显示产品的包装名称A, B, C,一旦用户单击该包装名称,就会显示特定产品(A,B,C)

我已经见过一些插件,例如产品包,但我不想使用任何插件,而我想不使用任何插件而动态地制作它。

我使用了以下脚本,但一次只能添加一种产品,而不能作为购物车中的包装添加。

jQuery脚本

$(document).on('click', '.ajax_add_to_cart', function (e) {
    var product_id =$(this).attr('data-product_id');
    var product_qty =$(this).attr('data-quantity');
     e.preventDefault();

        var $thisbutton = $(this),
            $form = $thisbutton.closest('form.cart'),
            id = $thisbutton.val(),
            product_qty = product_qty,
            product_id = product_id,
            variation_id = $form.find('input[name=variation_id]').val() || 0;

        var data = {
            action: 'woocommerce_ajax_add_to_cart',
            product_id: product_id,
            product_sku: '',
            quantity: product_qty,
            variation_id: variation_id,
        };

       $(document.body).trigger('adding_to_cart', [$thisbutton, data]);

        $.ajax({
            method: 'post',           
            url:custom_plugin_script.ajaxurl,
            data: data,
            beforeSend: function (response) {
                $('#loading_img').show();
                $thisbutton.removeClass('added').addClass('loading');
            },
            complete: function (response) {
                $thisbutton.addClass('added').removeClass('loading');
            },
            success: function (response) {                
                if( response.error != 'undefined' && response.error ){                  
                    return true;
                  } else {
                     setTimeout(function() {
                        jQuery('#successMessage').show('1000');
                    }, 3000); // <-- time in milliseconds
                  }
            },
        });

        return false;
    })(jQuery);

以下是我放入自定义插件主文件中的PHP脚本。

public function woocommerce_ajax_add_to_cart()
    {  
          ob_start();

       $product_id = apply_filters('woocommerce_add_to_cart_product_id', absint($_POST['product_id']));

       $quantity = empty($_POST['quantity']) ? 1 : wc_stock_amount($_POST['quantity']);
       $variation_id = absint($_POST['variation_id']);
       $passed_validation = apply_filters('woocommerce_add_to_cart_validation', true, $product_id, $quantity);
       $product_status = get_post_status($product_id);

      if ($passed_validation && WC()->cart->add_to_cart($product_id, $quantity, $variation_id) && 'publish' === $product_status) {

          do_action('woocommerce_ajax_added_to_cart', $product_id);
          wc_add_to_cart_message( $product_id );                
         // WC_AJAX :: get_refreshed_fragments();
      } else {

          $data = array(
              'error' => true,
              'product_url' => apply_filters('woocommerce_cart_redirect_after_error', get_permalink($product_id), $product_id));

          echo wp_send_json($data);
      } 
    die();

    }

有人对此有任何想法吗,如何才能通过问题来做到这一点?

1 个答案:

答案 0 :(得分:0)

您可以将json对象发送到服务器。

var request = new Object();
    request.action= 'woocommerce_ajax_add_to_cart';
    request.cart = new Array();

var product1 = new Object();
    product.id = 1;
    // and so on

var product2 = new Object();
    product.id = 2;
    // and so on

request.cart.push(product1);
request.cart.push(product2);

var data = request;

您也必须在ajax请求中定义数据类型