Блог

Я создал условие для отключения кнопки «Добавить в корзину», если в Shopify есть инвентарь. У меня работает кнопка, но я хочу изменить сообщение на «распродано», а не на «добавить в корзину / и отключено.

Вот код, который я собрал до сих пор, функция selectedVariant, которая передается в функцию validate, здесь не показана, но работает над получением активного варианта.

 let addToCartFormSelector = '#add-to-cart-form'

let productForm = {
validate: function(event, selectedVariant) {

let
  $form = $(this),
  hasVariant = selectedVariant !== null,
  canAddToCart = hasVariant amp;amp; selectedVariant.inventory_quantity > 0,

        // Select a valid variant if available
        if (canAddToCart) {
          // Available, enable the submit button, change text, show quantity elements
          $id.val(selectedVariant.id);
          $("#spanid").html("Add to cart");
          $addToCartButton.prop('disabled', false)
        }
        else {
          // Sold out, disable the submit button, change text, hide quantity elements
          $id.val('');
          $("#spanid").html("Sold out");
          $addToCartButton.prop('disabled', true)
        }
      }
    }

init: function() {
  $(document).on('form:change', addToCartFormSelector, productForm.validate);
}
 

вот разметка html

 {% form 'product', id: "add-to-cart-form" %}

        <button
          id="add-to-cart-button"
          type="submit"
          name="add"
          class="btn btn-main mx-auto w-100 js-cart-link"
          {% if can_add_to_cart != true %}disabled{% endif %}>
          <span id="spanid">
              {{ 'products.product.add_to_cart' | t }}
          </span>
        </button>

{% endform %}

 

Это пример кода из основной темы Shopify по умолчанию Brooklyn , и здесь показано, как они реализуют ту же вызываемую функцию variantChange .

Я думаю, это даст вам представление о дальнейших действиях.

Это фрагмент кода, для справки из той же Brooklyn темы, вам нужно проверить тему, которую вы используете, и использовать текущий код.