Bootstrap Notify Duplicate Notifications After Consequent AJAX Calls

Question

I'm using the most recent release of Bootstrap Notify (v3.1.5) to show status messages after an AJAX call. It works as expected in the first call. After the first execution, every time the notify is called, its shows the previous notifications message.

Example:

1st call = 1 Notify message; 2nd call = 2 Notify messages; 3rd call = 3 Notify messages; ...

Bootstrap Notify Initialisation:

$.notify({
    icon: icon,
    title: title,
    message: message
}, {
    type: type,
    allow_dismiss: true,
    newest_on_top: false,
    placement: {
        from: "top",
        align: "right"
    },
    offset: 20,
    spacing: 10,
    z_index: 100000,
    delay: delay,
    timer: 1000,
    mouse_over: true,
    animate: {
        enter: 'animated fadeInDown',
        exit: 'animated fadeOutUp'
    }
});

How can i solve this issue?

from where are you triggering this notify? Is it on a dynamically created DOM element? and whether the event makes the data to reload — JithPS, Feb 21 '17 at 08:43
solved my issue. after some debugging i realized that the event was being triggered multiple times and that cause the notifications to pop up repeatedly. really rookie mistake... — Ricky, Feb 21 '17 at 12:46

score 1 · Accepted Answer · answered Feb 21 '17 at 12:47

1

Solved my issue. After some debugging i realized that the event was being triggered multiple times and that cause the notifications to pop up repeatedly. Really big rookie mistake...

answered Feb 21 '17 at 12:47

Ricky

2,912
8
47
74

can u share how u solved this multiple triggering issue.Because right now i m facing the same. I found issue is multi trigerring but couldnt find a solution for it – JithPS Feb 21 '17 at 17:35
1

what happened in my case was that i was including the JS file with the event twice in the same page, and this caused a multiple event trigger. – Ricky Feb 21 '17 at 18:11

score 1 · Answer 2 · edited Aug 28 '20 at 14:52

1

you can prevent by using get all notifications length and prevent it. if notify greater than 0 return false;

let notifylength = document.querySelectorAll('.bootstrap-notify-container');
if(notifylength.length !== 0){
    return false;
}

edited Aug 28 '20 at 14:52

Kevdog777

908
7
20
43

answered Aug 28 '20 at 13:27

Lovekesh Kumar Singh

11
1

Bootstrap Notify Duplicate Notifications After Consequent AJAX Calls

2 Answers2