显示shopify api的响应说明（cart / add.js）

Question

I'm trying to show an alert every time customer is trying to add variant quantity that is bigger than available quantity. When that's happens I see 422 response from add.js -

{status: 422, message: "Cart Error",…}
description: "All 1 Black Basic High Waisted Briefs - black / 1 are in your cart."
message: "Cart Error"
status: 422

I need to display the description for customers, how that is possible?

Here is my code -

 var shopifyAjaxAddURL = '/cart/add.js';
  var shopifyAjaxCartURL = '/cart.js';
  var shopifyAjaxStorePageURL = '/search';

  $(document).on('submit', 'form[action="/cart/add"]:not(.noAJAX, .feedback-go_to_cart)', function(e) {
    var $form = $(this);

    //Add to cart
    $.post(shopifyAjaxAddURL, $form.serialize(), function(itemData) {
      //Enable add button
      $btn.html(theme.icons.tick + ' ' + {{ 'products.product.added_to_cart' | t | json }});
      setTimeout(function(){

      //Not added, show message
      if(typeof(data) != 'undefined' && typeof(data.status) != 'undefined') {
        var jsonRes = $.parseJSON(data.responseText);
        window.showQuickPopup(jsonRes.description, $btn);
      } else {
        //Some unknown error? Disable ajax and submit the old-fashioned way.
        $form.addClass('noAJAX');
        $form.submit();
      }
    });

Answer 1

Your code seems bit buggy. Possible solution could be, check if the status is 422 and send the customer an alert message.

if( itemData.status === 422 ) { alert('Quantity not available in the inventory') }

Full code might look like:

var shopifyAjaxAddURL = '/cart/add.js';
var shopifyAjaxCartURL = '/cart.js';
var shopifyAjaxStorePageURL = '/search';

$(document).on('submit', 'form[action="/cart/add"]:not(.noAJAX, .feedback-go_to_cart)', function (e) {
    var $form = $(this);

    //Add to cart
    $.post(shopifyAjaxAddURL, $form.serialize(), function (itemData) {
        if( itemData.status === 422 ) { alert('Quantity not available in the inventory') }
        else {
            //Enable add button
        $btn.html(theme.icons.tick + ' ' + {{ 'products.product.added_to_cart' | t | json }});
        setTimeout(function () {

            //Not added, show message
            if (typeof (data) != 'undefined' && typeof (data.status) != 'undefined') {
                var jsonRes = $.parseJSON(data.responseText);
                window.showQuickPopup(jsonRes.description, $btn);
            } else {
                //Some unknown error? Disable ajax and submit the old-fashioned way.
                $form.addClass('noAJAX');
                $form.submit();
            }
        }  
    });