Wednesday, 20 April 2016

Show Animated Notification Message While Postback

Many times while inserting or deleting records, you want to show a friendly notification message to user about that action.

Unlike desktop application, you don't have facility to show such message out of the box in web. Also showing java-script alert message is out of the fashion now.

Now there is trend of BootStrap and Notify JS for such stuff. So let's see how to show animated message to user about the action performed.

Step 1:
Include JQuery and Notify.JS in your page.

<script type="text/javascript" src="/admin/common/script/jquery-min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/notify/0.4.2/notify.min.js" type="text/javascript"></script>


Step 2:

Define variable to hold the value of different actions performed by user which you will use later on to show notification message accordingly.



Now set the operation variable as per the action (e.g. "Save" or "Delete) as shown below.



Finally based on the variable you set, show notification message to user by using $.notify() function.


Whenever user will save record, below message will appear and then disappear after few seconds.



This is simple but impressive way of showing notification to user about the action performed! Isn't it?

No comments:

Post a Comment