beforeClose not working in jGrowl?

Question

I have the following code which pulls json data from an ASP.NET page and displays these as notifications. The code will also take a note of what's been pulled through and store it in an array to prevent it being shown again in the same session.

I'm now trying to implement functionality so that when the user closes a message, it's ID is recorded in a cookie to prevent it ever being shown again. To do this, I'm trying to write to the cookie when the beforeClose event fires.

Everything else works fine apart from the saving to a cookie bit. Is there something wrong with my code that I'm missing?

var alreadyGrowled = new Array();
var noteCookie = $.cookie("notificationsViewed");
if (noteCookie != null) { alreadyGrowled = noteCookie.split(","); }

function growlCheckNew() {
$.getJSON('getNotifications.aspx', function(data) {
    $(data).each(function(entryIndex, entry) {
        var newMessage = true;
        $(alreadyGrowled).each(function(index, msg_id) {
            if (entry['ID'] == msg_id) {
                newMessage = false;
            }
        });

        if (newMessage == true) {
            $.jGrowl(entry['Message'], {
                sticky: true,
                header: entry['Title'],
                beforeClose: function(e, m) {
                    $.cookie("notificationsViewed", entry['ID']);
                }
            });
        }
        alreadyGrowled.push(entry['ID']);
    });
});

}

Answer 1

This:

        $.jGrowl(entry['Message'], {
            sticky: true,
            header: entry['Title'],
            beforeClose: function(e, m) {
                $.cookie("notificationsViewed", entry['ID']);
            }
        });

Needs to be:

        var id = entry['ID'];
        $.jGrowl(entry['Message'], {
            sticky: true,
            header: entry['Title'],
            beforeClose: function(e, m) {
                $.cookie("notificationsViewed", id);
            }
        });

Your beforeClose happens later, with the context of the created element, but entry is not available at this point, you'll probably see the cookie is getting set to undefined or erroring...this should fix that by explicitly passing the id into the closure.

Answer 2

OK. Using the close event, I can add the id of the message to a cookie, my next issue is that the cookie appears to be null/empty in a new session, despite me setting an expiry.

//notification functions
var alreadyGrowled = new Array();
var keepClosed = new Array();
var noteCookie = $.cookie("notificationsViewed");
if (!noteCookie) {
    $.cookie("notificationsViewed", "", { expires: 365, path: '/' });
} else {
    keepClosed = noteCookie.split(",");
}

function growlCheckNew() {
     $.getJSON('getNotifications.aspx', function(data) {
    $(data).each(function(entryIndex, entry) {
        var newMessage = true;
        $(alreadyGrowled).each(function(index, msg_id) {
            if (entry['ID'] == msg_id) {
                newMessage = false;
            }
        });

        $(keepClosed).each(function(index, msg_id) {
            if (entry['ID'] == msg_id) {
                newMessage = false;
            }
        });

        if (newMessage == true) {
            var id = entry['ID'];
            alreadyGrowled.push(id);
            $.jGrowl(entry['Message'], {
                sticky: true,
                header: entry['Title'],
                close: function(e, m) {
                    keepClosed.push(id);
                    $.cookie("notificationsViewed", keepClosed);
                }
            });
        }
    });
});
}