How to close a jgrowl manually

Question

All,

How to close and open a jgrowl manually

 jQuery("div.jGrowl").trigger("jGrowl.close");

The above code doesnt seem to work.

Thanks.

score 9 · Answer 1 · answered Apr 08 '11 at 13:20

9

This worked for me

$("div.jGrowl").jGrowl("close");

answered Apr 08 '11 at 13:20

Saiful

1,592
3
15
18

This syntax apparently doesn't work anymore. All it did for me was pop another jGrowl with a message of "close" – Kristopher Feb 15 '13 at 18:32

squarebrackets · Answer 2 · 2013-06-12T14:30:17.457

2

This one worked for me, closing the last notification:

$('div.jGrowl-close').triggerHandler('click');

Edit: Improved efficiency by replacing trigger with triggerHandler. See http://api.jquery.com/triggerHandler/

edited Jun 12 '13 at 14:30

answered Jun 12 '13 at 14:16

squarebrackets

987
2
12
19

score 2 · Answer 3 · edited Oct 17 '13 at 00:29

I had the same issue because I was adding a set of buttons into the growl notification. One was used to accept the notification and the other was used to ignore the notification. The approach I took was to add an afterOpen callback and then add a click handler with the reference to the original close element:

afterOpen: function(e,m,o){
    $(e).find("#acceptInvitation").click(function() {
        alert( "Invite Accepted" );
    });
    $(e).find("#declineInvitation").click(function() {
        $(e).children("div.jGrowl-close").trigger('click');
    });
}

score 2 · Answer 4 · edited Mar 24 '11 at 14:17

2

Three options:

$('div.jGrowl').find('div.jGrowl-notification').children().parent().remove();

$('div.jGrowl').find('div.jGrowl-notification').trigger('jGrowl.close');

$('div.jGrowl').find('.jGrowl-close').trigger('jGrowl.close');

Any of them close all notifications. I'm not sure how to close an individual notification, though.

edited Mar 24 '11 at 14:17

Justin

6,611
3
36
57

answered Nov 27 '10 at 21:51

Fernando

129
1
7

score 1 · Answer 5 · answered Dec 12 '12 at 22:50

The best method is

$(".jGrowl-notification:last-child").remove();

When jGrowl create a notification it use to create two jGrowl-notification DIVs where one is empty. So when ever you create a notification the last is the latest notification. So you need to close the last DIV with jGrowl-notification class.

When ever you wanted to open only single note use the below code, which will remove the previous note and create a new one

$(".jGrowl-notification:last-child").remove();

$.jGrowl("Hello World");

score 1 · Answer 6 · edited Jun 19 '13 at 19:44

$(".jGrowl-notification:last-child").jGrowl('close');

or

$(".jGrowl-notification:last-child").trigger('jGrowl.close')

Are the best ways to close a notification as all of the callbacks will be triggered accordingly.

Removing the mode bypasses the callbacks, which is less then ideal. Also note that to close a specific notification you will want to use the selector noted above.

The $.fn.jGrowl() method call is designed to parallel jQuery.UI's widget approach and has become fairly common place and I will most likely maintain this in future releases.

score 1 · Answer 7 · edited May 22 '12 at 15:36

1

The namespace comes after the event ..

so it should be

jQuery("div.jGrowl").trigger("close.jGrowl");

update after comment
The syntax mentioned in their blog could be a typo .. (did you try it out to see if it works ?)

Other than that, a support request at jquery plugins page dated feb 2009 may contain some more insight .. have a look ..

edited May 22 '12 at 15:36

Igor

33,276
14
79
112

answered Feb 19 '10 at 11:17

Gabriele Petrioli

191,379
34
261
317

@Gaby: > [According](http://www.stanlemon.netindex.jgrowl.html) to this it is as i said – Hulk Feb 19 '10 at 11:24
weird .. perhaps it is a typo ... did you try it out ? – Gabriele Petrioli Feb 19 '10 at 14:09

Akshay Kumar · Answer 8 · 2019-02-04T12:44:33.853

0

Use the click function and catch the event to close the current notification. For example:

$.jGrowl('Hi, It's a clickable close notification', {
      click: function(e, m, o) {
        $(e).jGrowl("close");
      }
    });

Here e refers to event, m for the message and o refers to the options.

Check this for more details.

NOTE: Use the latest jgrowl lib 1.3 onward.

edited Feb 04 '19 at 12:44

answered Jan 30 '19 at 05:55

Akshay Kumar

1
1

You just need to run your snippet to see the error. – Pingolin Feb 01 '19 at 08:09
Hi Armel, Sorry for convinience. It's just an example. Use this example(https://github.com/stanlemon/jGrowl/tree/master/examples) with my snippet. Hope it will work for you. – Akshay Kumar Feb 05 '19 at 12:15

score 0 · Answer 9 · answered Dec 07 '11 at 09:12

Here is a solution to close individual notifications:

testGrowl = function() {
 var ao, close;
 close = function(e) {
  console.log('close');
  return $(e).find('.jGrowl-close').trigger('click');
 };
 ao = function(e) {
   return setTimeout(function() {
   return close(e);
  }, 1500);
 };
 return $.jGrowl("Hello world!", {
   sticky: true,
   afterOpen: ao
  });
 };
setTimeout(testGrowl, 100);
setTimeout(testGrowl, 1000);

CoffeeScript and dialog here.

score 0 · Answer 10 · answered Jan 04 '12 at 00:36

Here's another solution for opening and closing individual messages that uses jGrowl's grouping feature:

var nextGroupID = 1;

var addMessage = function(message)
{
    var groupID = nextGroupID++;
    $.jGrowl(message, { sticky: true, group: "group-" + groupID });
    return groupID;
};

var removeMessage = function(groupID)
{
    $("div.jGrowl-notification.group-" + groupID).trigger("jGrowl.close");
}

// Example usage
addMessage("The first test message");
var testID = addMessage("The second test message");

setTimeout(function() {removeMessage(testID);}, 4000);

Mahesh · Answer 11 · 2014-12-31T13:13:43.487

-1

$('#jGrowl').find('.jGrowl-close').trigger('click');

edited Dec 31 '14 at 13:13

answered Dec 16 '14 at 07:49

Mahesh

567
2
14

1

Please add description to yuor answer – zohar Dec 16 '14 at 08:06

How to close a jgrowl manually

11 Answers11