Home > ASP.NET, javascript, JQuery > Jquery notification after postback asp.net

Jquery notification after postback asp.net

Hi All,

I read in many forums that developers are facing problem to display Jquery notification message on page after posting back. This is very important in any website now a days to make GUI very attractive.

Here is simple tutorial which will help you to solve above issue.

I am using Jquery notification message plug-in for displaying message.

Below is code for aspx page


<html xmlns=”http://www.w3.org/1999/xhtml”&gt;

<head id=”Head1″ runat=”server”>

<title>Jquery Postback demo</title>

<script src=”JS/jquery.showMessage.js” type=”text/javascript”></script>

<script src=”JS/jquery.showMessage.min.js” type=”text/javascript”></script>

<link href=”CSS/style_msg.css” rel=”stylesheet” type=”text/css” />

<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js&#8221;




<form id=”form1″ runat=”server”>


<asp:TextBox ID=”txtFirstname” runat=”server” />

<asp:Button ID=”btnSubmit” runat=”server” style=”height: 26px” />





I have just added one textbox and one button in HTML page below is code on button click event.

protected void btnSubmit_Click(object sender, EventArgs e)


RegisterJavascript(“You have entered” + txtFirstname.Text, “success”);


Before running it here is code for the function that we have called on button click.

/// <summary>

/// </summary>

/// <param name=”message”>Your message string</param>

/// <param name=”className”>Class name is use for what type of message it is like success,fail etc</param>

public void RegisterJavascript(string message, string className)


string prompt = “<script>jQuery(function() {jQuery(‘body’).showMessage({‘thisMessage’:[‘” + message + “‘],’className’:'” + className + “‘,’displayNavigation’:true,’autoClose’:true}); });</script>”;

ClientScript.RegisterStartupScript(typeof(Page), “prompt”, prompt);


I am just displaying text of textbox in  notification message. You can write any message on the page.

You can also write images html tags inside the message. For more details how this library works visit home page.

Jquery library which is being used in this demo can be downloadable from below link.


Download working source code of the demo Click here to download it.


  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: