Add out-of-stock text message to select options in Add to Cart Form

Created on 27 July 2024, 5 months ago

Problem/Motivation

Currently, customers need to select each variation via radio buttons or a select list to check stock availability, which can be time-consuming and inconvenient. This process negatively impacts the user experience as customers cannot quickly see which variations are in stock or out of stock. There is a need for a more efficient way to display variation stock availability directly on the product page without rendering an "Add to Cart" form for each variation.

Proposed Resolution

This enhancement aims to improve the user experience by displaying stock availability for all product variations directly on the product page as it loads. The solution involves:

1. Configurable Out-of-Stock Message:
- Adding a configuration option in the Drupal admin interface to set a customizable out-of-stock text message.

2. Modifying the Add-to-Cart Form:
- Dynamically including the out-of-stock text message in the attribute select options based on the stock status of each variation.

Feature request
Status

Active

Version

1.0

Component

Code

Created by

🇵🇹Portugal introfini

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @introfini
  • @introfini opened merge request.
  • 🇵🇹Portugal introfini

    introfini changed the visibility of the branch cherry-pick-84c6a86a to hidden.

  • 🇵🇹Portugal introfini

    introfini changed the visibility of the branch 8.x-1.x to hidden.

  • Status changed to Needs review 5 months ago
  • 🇵🇹Portugal introfini

    The merge request (MR) introduces this functionality.

    To configure the desired message, follow these steps:

    1. Navigate to /admin/commerce/config/stock/enforcement/settings.
    2. Set the desired message for out-of-stock notifications.

    With these settings updated, each product variation will now display an indication if it is out of stock.

  • 🇹🇷Turkey Umit Turkey

    Something like this is definitely needed. Otherwise, it will be too troublesome for the end user, and a CSS class should be added for styling in sites that use processed attributes.

    +1

  • 🇹🇷Turkey Umit Turkey
  • 🇨🇦Canada trevorkjorlien

    Needing this functionality myself. I ran the branch and can fill out and save the new form field.

    But when I load up a product page, the {{product.variations}} field doesn't appear, which loads the add to cart form. I also get this error:

    The website encountered an unexpected error. Please try again later.
    TypeError: Drupal\Core\Render\Element::children(): Argument #1 ($elements) must be of type array, null given, called in /Users/trevorkjorlien/Documents/Plateau Astro/Web/pa-drupal-2019/web/modules/contrib/commerce_stock/modules/enforcement/commerce_stock_enforcement.module on line 489 in Drupal\Core\Render\Element::children() (line 72 of core/lib/Drupal/Core/Render/Element.php).
    Drupal\Core\Render\Element::children(NULL) (Line: 489)
    commerce_stock_enforcement_form_commerce_order_item_add_to_cart_form_alter(Array, Object, 'commerce_order_item_add_to_cart_form_commerce_product_20') (Line: 562)
    Drupal\Core\Extension\ModuleHandler->alter('form', Array, Object, 'commerce_order_item_add_to_cart_form_commerce_product_20') (Line: 840)
    Drupal\Core\Form\FormBuilder->prepareForm('commerce_order_item_add_to_cart_form_commerce_product_20', Array, Object) (Line: 284)
    Drupal\Core\Form\FormBuilder->buildForm(Object, Object) (Line: 97)
    Drupal\commerce_product\ProductLazyBuilders->addToCartForm('20', 'full', 1, 'en')
    call_user_func_array(Array, Array) (Line: 101)
    Drupal\Core\Render\Renderer->doTrustedCallback(Array, Array, 'Render #lazy_builder callbacks must be methods of a class that implements \Drupal\Core\Security\TrustedCallbackInterface or be an anonymous function. The callback was %s. See https://www.drupal.org/node/2966725', 'exception', 'Drupal\Core\Render\Element\RenderCallbackInterface') (Line: 788)
    Drupal\Core\Render\Renderer->doCallback('#lazy_builder', Array, Array) (Line: 353)
    Drupal\Core\Render\Renderer->doRender(Array, 1) (Line: 204)
    Drupal\Core\Render\Renderer->render(Array, 1) (Line: 160)
    Drupal\Core\Render\Renderer->Drupal\Core\Render\{closure}() (Line: 580)
    Drupal\Core\Render\Renderer->executeInRenderContext(Object, Object) (Line: 159)
    Drupal\Core\Render\Renderer->renderPlain(Array) (Line: 175)
    Drupal\Core\Render\Renderer->renderPlaceholder('callback=commerce_product.lazy_builders%3AaddToCartForm&args%5B0%5D=20&args%5B1%5D=full&args%5B2%5D=1&args%5B3%5D=en&token=FT-D0BG4z9OAbw_Xou5fuAUgPUogXOigYpvmDRhFbjc', Array) (Line: 693)
    Drupal\big_pipe\Render\BigPipe->renderPlaceholder('callback=commerce_product.lazy_builders%3AaddToCartForm&args%5B0%5D=20&args%5B1%5D=full&args%5B2%5D=1&args%5B3%5D=en&token=FT-D0BG4z9OAbw_Xou5fuAUgPUogXOigYpvmDRhFbjc', Array) (Line: 547)
    Drupal\big_pipe\Render\BigPipe->sendPlaceholders(Array, Array, Object) (Line: 305)
    Drupal\big_pipe\Render\BigPipe->sendContent(Object) (Line: 112)
    Drupal\big_pipe\Render\BigPipeResponse->sendContent() (Line: 381)
    Symfony\Component\HttpFoundation\Response->send() (Line: 20)
Production build 0.71.5 2024