Amy Amy - 4 months ago 15
Javascript Question

notifyjs - hide notification from elsewhere

I am using notifyjs for some notifications. I notice that

returns an element, not an object I can use to manipulate the notification. How can I hide the notification from an external event, such as clicking a button?

Is it possible to somehow inject an element ID or class name into the notification, so I can select it later using jQuery? Right now all I see is:

<div class="notifyjs-wrapper">
<div class="notifyjs-arrow" style="..."></div>
<div class="notifyjs-container" style="...">
<div class="notifyjs-bootstrap-base notifyjs-bootstrap-info">
<span data-notify-text="">No Pick Tickets To Create</span>

There's nothing specific I can use to later identity the notification. Following one of the examples on the notifyjs page, I attempted:

title: $('<div id="foobar"></div>').text("the message")
}, {

But this results in a broken notification.


It's a pretty interesting problem. Notify.js doesn't provide any method to target the generated notification but it does allow to create a style which can be used easily. The only constraint with that idea you will be able to target only one notification at a time.

See this fiddle.


<div class="notifyjs" data-notify-html="title"></div>


// Create new style called foo which has an id assigned to it's primary container
$.notify.addStyle('foo', {
    '<div id="someContainer">' +
      '<div class="clearfix">' +
        '<div class="title" data-notify-html="title"/>' +
      '</div>' +

// Generate the notification
    title: 'You MUST have some Foo !'
}, {
    style: 'foo'

// Target the id from 'foo' style and go up the DOM to find the actual wrapper
var $notification = $('#someContainer').parent('.notifyjs-container').parent('.notifyjs-wrapper');


// Add some id to the notification wrapper
$($notification).attr('id', 'someIdAdded');