javascript-debounce-function-on-input-ajax-request

utils.js

function debounce(func, wait, immediate) {
    let timeout;
    return function () {
        const context = this;
        const args = arguments;

        const later = function () {
            timeout = null;
            if (!immediate) func.apply(context, args);
        };

        const callNow = immediate && !timeout;

        clearTimeout(timeout);
        timeout = setTimeout(later, wait);

        if (callNow) func.apply(context, args);
    };
}


function deleteProduct() {
    const productsTable = document.getElementById("c-products-table");
    const productDeleteForm = document.getElementById("c-delete-product-form");

    if (!productsTable || !productDeleteForm) {
        return;
    }

    const handleDeleteProduct = function (e, productId) {
        e.preventDefault();
        let actionUrl = getCurrentActionUrl(productId);
        const actionForm = e.target;
        actionForm.action = actionUrl;
        actionForm.submit();
    };

    productsTable.addEventListener("click", function (e) {
        const productDeleteBtn = e.target.closest("#c-product-delete-btn");

        if (productDeleteBtn) {
            e.preventDefault();
            const productId = productDeleteBtn.dataset.productId;

            if (!productId) {
                return;
            }

            productDeleteForm.addEventListener("submit", (e) =>
                handleDeleteProduct(e, productId)
            );
        }
    });
}