Files
wc-bootstrap/assets/js/quantity.js

40 lines
1.3 KiB
JavaScript
Raw Permalink Normal View History

/**
* Quantity Input +/- Button Handler
*
* Handles increment/decrement for Bootstrap 5 quantity input groups.
* Respects min, max, and step attributes on the input element.
* Triggers 'change' event so WooCommerce JS picks up the new value.
*
* @package WcBootstrap
* @since 0.1.0
*/
(function () {
'use strict';
function handleQuantityClick(e) {
var button = e.target.closest('.wc-qty-minus, .wc-qty-plus');
if (!button) return;
var target = button.getAttribute('data-target');
var input = target ? document.querySelector(target) : button.closest('.quantity').querySelector('input');
if (!input) return;
var currentVal = parseFloat(input.value) || 0;
var min = parseFloat(input.getAttribute('min')) || 0;
var max = parseFloat(input.getAttribute('max')) || Infinity;
var step = parseFloat(input.getAttribute('step')) || 1;
if (button.classList.contains('wc-qty-minus')) {
var newVal = currentVal - step;
input.value = newVal >= min ? newVal : min;
} else {
var newVal = currentVal + step;
input.value = max !== Infinity && newVal > max ? max : newVal;
}
input.dispatchEvent(new Event('change', { bubbles: true }));
}
document.addEventListener('click', handleQuantityClick);
})();