Shopify.queue, addItem and line item properties

Cloud_Success
New Member
1 0 1

Hi Everyone,

Firstly I've tried contacting Shopify support for help with this but have to say totally underwhelmed.

What I'm trying to do is add a product (variant) to the shopping cart with properties via the AJAX API. Unfortunately there doesn't seem to be a way of doing this other than posting to params via a form / hidden field which sadly isn't an option in this case.

Can anyone help? Is there a way for me to send properties with an item when using Shopify.addItem?

Thanks in advance

Will44
Shopify Partner
2 0 1

I was trying to do the same thing and here is my solution based on this thread.

<script>
  Shopify.queue = [];

  Shopify.moveAlong = function() {
    // If we still have requests in the queue, let's process the next one.
    if (Shopify.queue.length) {
      var request = Shopify.queue.shift();
      // pass the properties into addItem as well
      Shopify.addItem(request.variantId, request.quantity, request.properties, Shopify.moveAlong);
    }
    // If the queue is empty, we will redirect to the cart page.
    else {
      document.location.href = '/cart';
    }
  };

  // Create a new Shopify.addItem function that takes the 'properties' parameter
  Shopify.addItem = function(id, qty, properties, callback) {
    var params = {
      quantity: qty,
      id: id
    };
    if(properties != false){
      params.properties = properties;
    }
    $.ajax({
      type: 'POST',
      url: '/cart/add.js',
      dataType: 'json',
      data: params,
      success: function(){
        if(typeof callback === 'function'){
          callback();
        }
      },
      error: function(){}
    });
  }

  function push_to_queue(variantID, quantity, properties) {
    Shopify.queue.push({
      variantId: variantID,
      quantity: quantity,
      properties: properties
    });
  }
</script>

 

Usage:

// push product(s) to queue
push_to_queue(variantID, quantity, properties);

// process the queue
Shopify.moveAlong();

 

Also note that properties has to be a Javascript object; using Javascript Array won't work.

0 Likes
Will44
Shopify Partner
2 0 1

I was trying to do the same thing and here is my solution based on this thread.

<script>
  Shopify.queue = [];

  Shopify.moveAlong = function() {
    // If we still have requests in the queue, let's process the next one.
    if (Shopify.queue.length) {
      var request = Shopify.queue.shift();
      // pass the properties into addItem as well
      Shopify.addItem(request.variantId, request.quantity, request.properties, Shopify.moveAlong);
    }
    // If the queue is empty, we will redirect to the cart page.
    else {
      document.location.href = '/cart';
    }
  };

  // Create a new Shopify.addItem function that takes the 'properties' parameter
  Shopify.addItem = function(id, qty, properties, callback) {
    var params = {
      quantity: qty,
      id: id
    };
    if(properties != false){
      params.properties = properties;
    }
    $.ajax({
      type: 'POST',
      url: '/cart/add.js',
      dataType: 'json',
      data: params,
      success: function(){
        if(typeof callback === 'function'){
          callback();
        }
      },
      error: function(){}
    });
  }

  function push_to_queue(variantID, quantity, properties) {
    Shopify.queue.push({
      variantId: variantID,
      quantity: quantity,
      properties: properties
    });
  }
</script>

 

Usage:

// push product(s) to queue
push_to_queue(variantID, quantity, properties);

// process the queue
Shopify.moveAlong();

 

Also note that properties has to be a Javascript object; using Javascript Array won't work.