How can i Limit a alert.

[dineshpandianr]

I need only one alert

[mouse0270]

Like you only want to show one alert of different content at a time?

[ahumellihuk]

I think both me and @dineshpandianr want the same thing - option to set the maximum number of alerts displayed simultaneously, in other words - ability to limit the number of notifications on the screen at any given time. The oldest visible notification would be removed in favour of the new one.

[mouse0270]

I am working on adding this because I need it for a project I am working on. On Tue, Mar 22, 2016 at 9:00 AM Dmitri Samoilov [email protected] wrote:

I think both me and @dineshpandianr https://github.com/dineshpandianr want the same thing - option to set the maximum number of alerts displayed simultaneously, in other words - ability to limit the number of notifications on the screen at any given time. The oldest visible notification would be removed in favour of the new one.

— You are receiving this because you commented. Reply to this email directly or view it on GitHub https://github.com/mouse0270/bootstrap-notify/issues/136#issuecomment-199801468

[empz]

+1 Came to ask exactly this. I only want one active notification at a time. I tried doing

$.notifyClose();
$.notify({...});

But since the new notification appears before the old one is done animating out it ends up being below.

On the other hand, doing that with newest_on_top: true kinda works (although you see how a new one appears and the previous dissapears). But it does the trick until the library provides a limit.

[mouse0270]

Just to be clear, in the new version it doesn't really limit 1 notification but queues them on one of two options, queue and restrict. Where queue will only show a specific number, once one of them closes it will show the next notification in the queue. Restrict will force close the oldest notification to show the newest one called.

This still plays the animations associated with the queue.

I could say if on restrict the exit animation doesn't play? That may work... not sure.

[empz]

I guess that's ok.

In my specific case I only want one notification at a time because it's the same notification that could be shown several times if people keep typing stuff in a textbox. So yeah, I only want one in this case because the others that might appear would be exactly the same.

I think your queue and restrict approach is perfectly fine. I don't think you need to make it to not play the exit animation on restrict.

On 31 March 2016 at 15:02, Robert McIntosh [email protected] wrote:

Just to be clear, in the new version it doesn't really limit 1 notification but queues them on one of two options, queue and restrict. Where queue will only show a specific number, once one of them closes it will show the next notification in the queue. Restrict will force close the oldest notification to show the newest one called.

This still plays the animations associated with the queue.

I could say if on restrict the exit animation doesn't play? That may work... not sure.

— You are receiving this because you commented. Reply to this email directly or view it on GitHub https://github.com/mouse0270/bootstrap-notify/issues/136#issuecomment-204056913

[mouse0270]

Why don't you use the update feature instead of creating new notifications?

[empz]

@mouse0270 I've missed that completely.

Anyway I don't save the $.notify reference and even if I did I'd have to check whether it's active to update it or if it's not show a new one. Too much logic. I'm fine with how it's now.

[ahumellihuk]

In my specific case I only want one notification at a time because it's the same notification that could be shown several times if people keep typing stuff in a textbox. So yeah, I only want one in this case because the others that might appear would be exactly the same.

@emzero I think there's an 'allow_duplicates' option , which when set to false, result in Notify checking whether the new notification is a duplicate and not showing it if it is.

[chneau]

@mouse0270 Thanks for the updates but can you tell us where is documentation of "queue and restrict" ? Same need, I would like to restrict to few notification at a time.

[ghost]

Has this been fixed already? Or is there a workaround, I need this to work for a project.

[mouse0270]

The queue and restrict is part of the new version. I finally finished my other work, that I started working on this again last weekend. I am hoping to release it tomorrow.

[netbka]

Hello, Do you have any progress on that?

[fmoutawe]

Any news about this feature ?

Thanks.

[jtal]

I dont want to assault my users with all old notifications every time a new notification is displayed. It looks like I can use update to change the message, type, etc. But since I am recycling the same notification, how do I make it visible again? Thanks for any help.

[rgriffith]

@mouse0270 I have a project where we'd like to queue and show one notification at a time; trying to mimic Material UI's snackbar. Is there any update on the queue/restrict functionality?

[thesved]

I have created a pull request for this feature: https://github.com/mouse0270/bootstrap-notify/pull/186

If you place notifications to the top, I suggest to you to use it the following way. Otherwise if newest isn't showing up at top, then notifications can stuck lower than the top of the browser.

restrict: 1,
newest_on_top: true
placement: {
  from: 'top',
  align: 'right'
}

[artificialidentity]

The above pull request has not been merged yet, however, I did find a work around for anyone else who stumbles upon this.

This solution does not modify the existing code base, which means you are safe if a new version is created or you are using composer as a dependency manager (which is what I am doing).

The solution is to store the notification in a variable

var notification = null;

Then before you create it, check if it exists. I am using JQueries length() function.

if($("[class*=\"alert-\"]").length) {
  notification.update({
    title: "I'm a notification",
    message: "Hello World, I was updated"
  });
}
else {
  notification = $.notify({
    title: "I am notification", 
    message: "Hello World!"
  });
}

There is a downfall to this. I am using Fortawesome 5 icons (svg based) and when you do an update, the icon disappears. I had to remove it.

^ Edit: This only occurs when the icon is within the same element marked as data-notifiy="title" Example..

<h5 data-notifiy="title"><i data-notify="icon"</i>{1}</h5>

Work around..

<h5><i data-notify="icon"</i><span  data-notifiy="title">{1}</span></h5>

I have also tried destroying the notification, which doesn't work because the new notification gets created before the old one is destroyed causing it be created below the currently existing one.

[mehmetakify]

For one alert: Give a class to notify div element in template setting and remove it before notify. Like this:

$('div.notification').remove();
$.notify({
    message: "I hope I can help you"
}, {
    type: 'danger',
    template: '<div data-notify="container" class="notification alert alert-{0}" role="alert">' +
        '<img data-notify="icon" class="img-circle pull-left">' +
        '<span data-notify="title">{1}</span>' +
        '<span data-notify="message" style="display: inline-block;">{2}</span>' +
    '</div>'
});