Add a product to cart when discount code is used

Prerequisite

1: Create the discount code. In our example: FREE_AUTO_ADDED_PRODUCT

2: Determine the variant id of the product you wish to be added. Learn how to do this here:

Prompt

In the Custom HTML section, choose any section. Then type an AI prompt like: I want to check whether the discount code FREE_AUTO_ADDED_PRODUCT is used and if it is then I want to automatically add product with variant id 50829687161111 to cart.

Resulting Code

This will result in code like like the following. Save the EliteCart settings, open EliteCart in your theme, and check whether everything works as intended.

<div id="discount-auto-add-handler" class="tw-hidden">
  <script>
    (function() {
      const TARGET_DISCOUNT_CODE = 'FREE_AUTO_ADDED_PRODUCT';
      const AUTO_ADD_VARIANT_ID = '50829687161111';
      let isProcessing = false;

      function hasTargetDiscount(cartData) {
        if (!cartData) return false;
        // Check if discount codes are available in cart data
        if (cartData.discount_codes && Array.isArray(cartData.discount_codes)) {
          return cartData.discount_codes.some(discount => 
            discount.code && discount.code.toUpperCase() === TARGET_DISCOUNT_CODE
          );
        }
        // Fallback: check if discounts are in cart attributes or other location
        if (cartData.attributes && cartData.attributes.discount_code) {
          return cartData.attributes.discount_code.toUpperCase() === TARGET_DISCOUNT_CODE;
        }
        return false;
      }

      function hasAutoAddProduct(cartData) {
        if (!cartData || !cartData.items) return false;
        return cartData.items.some(item => 
          item.variant_id && item.variant_id.toString() === AUTO_ADD_VARIANT_ID
        );
      }

      async function addAutoProduct() {
        if (isProcessing) return;
        isProcessing = true;
        
        try {
          // Use fetch to add product to cart
          const response = await fetch('/cart/add.js', {
            method: 'POST',
            headers: {
              'Content-Type': 'application/json',
            },
            body: JSON.stringify({
              id: AUTO_ADD_VARIANT_ID,
              quantity: 1
            })
          });
          
          if (response.ok) {
            // Trigger cart update in EliteCart
            if (window.EliteCart && typeof window.EliteCart.refreshCart === 'function') {
              window.EliteCart.refreshCart();
            }
          }
        } catch (error) {
          console.warn('Failed to auto-add product:', error);
        } finally {
          isProcessing = false;
        }
      }

      async function removeAutoProduct() {
        if (isProcessing) return;
        
        const cartData = window.EliteCart.getCurrentCart();
        if (!cartData || !cartData.items) return;
        
        const autoProduct = cartData.items.find(item => 
          item.variant_id && item.variant_id.toString() === AUTO_ADD_VARIANT_ID
        );
        
        if (!autoProduct) return;
        
        isProcessing = true;
        
        try {
          const response = await fetch('/cart/change.js', {
            method: 'POST',
            headers: {
              'Content-Type': 'application/json',
            },
            body: JSON.stringify({
              id: autoProduct.variant_id,
              quantity: 0
            })
          });
          
          if (response.ok) {
            // Trigger cart update in EliteCart
            if (window.EliteCart && typeof window.EliteCart.refreshCart === 'function') {
              window.EliteCart.refreshCart();
            }
          }
        } catch (error) {
          console.warn('Failed to remove auto product:', error);
        } finally {
          isProcessing = false;
        }
      }

      function handleCartChange(cartData) {
        if (!cartData || isProcessing) return;
        
        const hasDiscount = hasTargetDiscount(cartData);
        const hasProduct = hasAutoAddProduct(cartData);
        
        if (hasDiscount && !hasProduct) {
          // Discount present but product not in cart - add it
          addAutoProduct();
        } else if (!hasDiscount && hasProduct) {
          // Discount not present but product is in cart - remove it
          removeAutoProduct();
        }
      }

      // Initialize on page load
      const initialCart = window.EliteCart.getCurrentCart();
      handleCartChange(initialCart);

      // Listen for cart changes
      window.EliteCart.onCartChange(handleCartChange);
    })();
  </script>
</div>