Js does not close the opened element, how to fix it?

  • 0
    Good day. I don't know Js at all, the problem is this. On the WordPress website, when adding to the cart, a notification pops up "The item has been successfully added to the cart" but the notification does not disappear.

    It needs to disappear after 4-5 seconds. Tell me how to fix it. I enclose the code:

    function init_prod_row_actions() {
    
            $('.qty_plus').unbind().click(function (e) {
                $input = $(this).closest('.quantity_cont').find('.prod_qty');
                var val = parseInt($input.val());
                $input.val(val + 1).change();
            });
    
            $('.qty_minus').unbind().click(function (e) {
                $input = $(this).closest('.quantity_cont').find('.prod_qty');
                var val = parseInt($input.val());
                if (val > 1) {
                    $input.val(val - 1).change();
                }
            });
    
            $('.prod_qty').change(function (e) {
                e.preventDefault();
                e.stopPropagation();
                $priceCont = $(this).closest('.prod_js').find('.prod_price');
                $price = parseInt($priceCont.attr('data-price'));
                var val = $(this).val(),
                    cont = $(this).closest('.prod_js');
    
                cont.find('.add_to_cart_custom').attr('data-qty', val);
                $priceCont.html(val * $price + ' руб.')
            });
    
            $('.prod_variations li').click(function () {
                var price = $(this).attr('data-price'),
                    id = $(this).attr('data-id'),
                    container = $(this).closest('.prod_js'),
                    val = parseInt(container.find('.prod_qty').val());
    
                if (!val) {
                    val = 1;
                }
    
                container.find('.add_to_cart_custom').attr('data-id', id);
                container.find('.prod_price').html(val * price + ' руб.').attr('data-price', price);
                container.find('.prod_variations li').removeClass('active');
                $(this).addClass('active');
            });
    
            $('.prod_variations li:first-child').click();
    
    
            $('.add_to_cart_custom').click(function (e) {
                e.preventDefault();
                e.stopPropagation();
                var qty = $(this).attr('data-qty');
                if (!qty) {
                    qty = 1;
                }
                $.ajax({
                    data: {action: 'ajax_to_cart', id: $(this).attr('data-id'), qty: qty},
                    url: '/wp-admin/admin-ajax.php',
                    method: 'POST'
                }).done(function (response) {
                    response = $.parseJSON(response);
                    if ($('#notices').length === 0) {
                        $('body').append('<div id="notices"></div>');
                    }
                    $('#notices').html('<div class="alert alert-success alert-dismissible fade show" role="alert">\n' +
                        '  Товар успешно добавлен в корзину' +
                        '  <button type="button" class="close" data-dismiss="alert" aria-label="Close">\n' +
                        '  </button>\n' +
                        '</div>');
                    $('.basket-btn__counter').html('(' + response.count + ')');
                })
            });
        }
    JavaScript Dominick Nash, Nov 14, 2020

  • 1 Answers
  • 0
    $('#notices').html('<div class="alert alert-success alert-dismissible fade show" role="alert">\n' +
    ' Товар успешно добавлен в корзину' +
    ' <button type="button" class="close" data-dismiss="alert" aria-label="Close">\n' +
    ' </button>\n' +
    '</div>');

    // удалить через пять сек.
    setTimeout(function(){
    $('#notices').empty();
    }, 5000);
    Hadley Vance

Your Answer
To place the code, please use CodePen or similar tool. Thanks you!