Geeks With Blogs
My Blog

Lately I've been using JBar, a very neat jQuery plugin for displaying notifications in my web applications. Unfortunately the original version of JBar only supports binding to the click event of a DOM item. In order to get around this limitation I have modified the source code and posted an updated version on my GitHub account here. The modified version allows you to display a JBar notification by calling a method. I typically use it to display succes or failure messages when doing Ajax calls.

I have also included some additional CSS and JS so that you can diplay different styles of notifications.

showNotification(message) shows a green "success" message.

showWarning(message) shows an orange "warning" message.

showMessage(message, className) allows you to specify a custom class to apply to the notification for additional styling purposes.

A web page with samples is included.


Get the code here.

Posted on Friday, May 21, 2010 10:34 AM | Back to top

Comments on this post: Customizing JBar for Notifications

# re: Customizing JBar for Notifications
Requesting Gravatar...
I found your customized version of jbar and really like it. I'm trying to call the function like so after an ajax form submission:

type: "POST",
url: "questions.php",
data: $(this).serialize(),
success: showNotification('Something good happened!'),
error: function(msg){
// alert( "ERROR: " + msg );

ANy idea what I'm missing?

Left by Paul on Jun 29, 2011 3:58 PM

Your comment:
 (will show your gravatar)

Copyright © Ryan Ohs | Powered by: