In this article, I will show you how to flash message using Jquery. Let’s suppose you are posting some data and you want to flash a message that data is processed or something like that. Check out the following code snippet it is self-explanatory
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FlashMessage.aspx.cs" Inherits="FlashMessage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.style1
{
width: 100%;
}
</style>
<script src="Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#btnInsert").click(function() {
var name = $("#txtName").val();
var age = $("#txtAge").val();
$.ajax(
{
type: "POST",
data: "{'name':'" + name + "',age:'" + age + "'}",
dataType: "json",
contentType: "application/json",
url: "FlashMessage.aspx/InsertEmployee",
success: function(response) {
$("#gridView").html(response.d);
$("#message").html("");
$("#message").html("Employee inserted successfully!").fadeIn("6000").fadeOut("2000");
}
});
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div id="gridView">
</div>
<table class="style1">
<tr>
<td>
Name
</td>
<td>
<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
Age
</td>
<td>
<asp:TextBox ID="txtAge" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<input type="button" id="btnInsert" value="Insert" />
</td>
<td>
</td>
</tr>
<tr>
<td colspan="2">
<div id="message" style="background-color: #ffaa00; width: 200px; display: none">
</div>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
public partial class FlashMessage : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
private static string ConvertControlToHTML(Control source)
{
StringWriter sw = new StringWriter();
HtmlTextWriter htw = new HtmlTextWriter(sw);
source.RenderControl(htw);
return sw.ToString();
}
[System.Web.Services.WebMethod]
[System.Web.Script.Services.ScriptMethod]
public static string InsertEmployee(string name, int age)
{
Employee emoloyeeObject = new Employee();
emoloyeeObject.InsertEmployee(name, age);
GridView gv = new GridView();
gv.ShowHeader = true;
gv.AutoGenerateColumns = true;
gv.DataSource = HttpContext.Current.Session["emp"];
gv.DataBind();
return ConvertControlToHTML(gv);
}
}
public class Employee
{
public string Name { get; set; }
public int Age { get; set; }
public void InsertEmployee(string name, int age)
{
List<Employee> list = new List<Employee>();
if (HttpContext.Current.Session["emp"] == null)
{
list.Add(new Employee() { Name = name, Age = age });
HttpContext.Current.Session["emp"] = list;
}
else
{
list = HttpContext.Current.Session["emp"] as List<Employee> ;
list.Add(new Employee() { Name = name, Age = age });
}
}
}