55 lines
No EOL
2 KiB
JavaScript
55 lines
No EOL
2 KiB
JavaScript
// Function to initialize number input buttons
|
|
function initNumberInputs(container = document) {
|
|
container.querySelectorAll('.number-input-wrapper').forEach(function(wrapper) {
|
|
const input = wrapper.querySelector('input[type="number"]');
|
|
const decreaseBtn = wrapper.querySelector('[data-action="decrease"]');
|
|
const increaseBtn = wrapper.querySelector('[data-action="increase"]');
|
|
|
|
if (!input || !decreaseBtn || !increaseBtn) return;
|
|
|
|
// Skip if already initialized
|
|
if (decreaseBtn.hasAttribute('data-initialized')) return;
|
|
|
|
const step = parseFloat(input.getAttribute('step')) || 1;
|
|
const min = 0;
|
|
const max = input.getAttribute('max') ? parseFloat(input.getAttribute('max')) : null;
|
|
|
|
decreaseBtn.addEventListener('click', function() {
|
|
const currentValue = parseFloat(input.value) || 0;
|
|
const newValue = currentValue - step;
|
|
|
|
if (min === null || newValue >= min) {
|
|
input.value = newValue;
|
|
input.dispatchEvent(new Event('change', { bubbles: true }));
|
|
}
|
|
});
|
|
|
|
increaseBtn.addEventListener('click', function() {
|
|
const currentValue = parseFloat(input.value) || 0;
|
|
const newValue = currentValue + step;
|
|
|
|
if (max === null || newValue <= max) {
|
|
input.value = newValue;
|
|
input.dispatchEvent(new Event('change', { bubbles: true }));
|
|
}
|
|
});
|
|
|
|
// Validate input on change
|
|
input.addEventListener('input', function() {
|
|
const value = parseFloat(this.value);
|
|
|
|
if (min !== null && value < min) {
|
|
this.value = min;
|
|
}
|
|
if (max !== null && value > max) {
|
|
this.value = max;
|
|
}
|
|
});
|
|
|
|
// Mark as initialized
|
|
decreaseBtn.setAttribute('data-initialized', 'true');
|
|
increaseBtn.setAttribute('data-initialized', 'true');
|
|
});
|
|
}
|
|
|
|
export { initNumberInputs };
|