UpdatePanel control in Asp.net,C#
Bangalore: UpdatePanel is an Ajax server control it helps you to update the selected panel without refreshing the whole page.if you have an ajax enabled web site and you want to update particular parts of the page without refreshing the whole page you can add one script manager control and you can use the update panel control to refreshing it.
Consider we have two panels and its having one label and one button in each panel. and on button click we are setting the current time into the label. so we try to update both panel on single button click normally it wont update both. It will update corresponding panel on respective buttton click. so what we have to do
for updating both panels on single button clik. the answer is trigger.
we will add trigger on second panel and give controls to first button so on first button click it will update both panels. on second button click it will update only second panel.
Create a Empty webproject in your vs2010 and include a script manager control into your project and write the below code in your updatepanel.aspx page
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UpdatePanel.aspx.cs" Inherits="Validation.UpdatePanel" %>
<!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>Update Panel</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="updatepanel" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="lbl1" runat="server"></asp:Label>
<asp:Button ID="btn1" runat="server" Text="Trigger" onclick="btn1_Click"/>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="updatepnl2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="lbl2" runat="server"></asp:Label>
<asp:Button ID="btn2" runat="server" Text="Normal" onclick="btn2_Click" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btn1" EventName="click" />
</Triggers>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
code behind.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Validation
{
public partial class UpdatePanel : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btn1_Click(object sender, EventArgs e)
{
lbl1.Text = DateTime.Now.ToLongTimeString();
lbl2.Text = DateTime.Now.ToLongTimeString();
}
protected void btn2_Click(object sender, EventArgs e)
{
lbl1.Text = DateTime.Now.ToLongTimeString();
lbl2.Text = DateTime.Now.ToLongTimeString();
}
}
}
for updating both panels on single button clik. the answer is trigger.
we will add trigger on second panel and give controls to first button so on first button click it will update both panels. on second button click it will update only second panel.
Create a Empty webproject in your vs2010 and include a script manager control into your project and write the below code in your updatepanel.aspx page
<!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>Update Panel</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="updatepanel" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="lbl1" runat="server"></asp:Label>
<asp:Button ID="btn1" runat="server" Text="Trigger" onclick="btn1_Click"/>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="updatepnl2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="lbl2" runat="server"></asp:Label>
<asp:Button ID="btn2" runat="server" Text="Normal" onclick="btn2_Click" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btn1" EventName="click" />
</Triggers>
</asp:UpdatePanel>
</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;
namespace Validation
{
public partial class UpdatePanel : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btn1_Click(object sender, EventArgs e)
{
lbl1.Text = DateTime.Now.ToLongTimeString();
lbl2.Text = DateTime.Now.ToLongTimeString();
}
protected void btn2_Click(object sender, EventArgs e)
{
lbl1.Text = DateTime.Now.ToLongTimeString();
lbl2.Text = DateTime.Now.ToLongTimeString();
}
}
}
.jpg)
0 comments: