Scribd
Upload
219 views

Programmatically Update The UpdatePanel Using ASP

This document describes how to programmatically update an ASP.NET UpdatePanel control from code behind. It shows using two UpdatePanel controls, one containing a button and one containing a label to display the time. When the button is clicked, the code behind gets the current time and sets the label's text, then calls Update() on the second UpdatePanel to refresh its contents with the new time. Setting UpdateMode to Conditional and ChildrenAsTriggers to false ensures only that panel refreshes on button clicks rather than the whole page.

Uploaded by

a_sumant4u
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
219 views

Programmatically Update The UpdatePanel Using ASP

This document describes how to programmatically update an ASP.NET UpdatePanel control from code behind. It shows using two UpdatePanel controls, one containing a button and one containing a label to display the time. When the button is clicked, the code behind gets the current time and sets the label's text, then calls Update() on the second UpdatePanel to refresh its contents with the new time. Setting UpdateMode to Conditional and ChildrenAsTriggers to false ensures only that panel refreshes on button clicks rather than the whole page.

Uploaded by

a_sumant4u
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

Programmatically Update the UpdatePanel using ASP.

NET

Im going to describe how to update the Asp.net Ajax Update panel control programmatically.
Im using visual studio 2008 with this sample code

Introduction

Sometime we need to update the update panel from another update panel or within the
update panel using programmatically C# code behind. Here I will show you how to
update the update panel from another panel. By clicking the button from one update
panel, which should update the date and time in another update panel.

ScriptManager and UpdatePanel

So we need to have script manager control and update panels as shown below.

<%@ Page Language="C#" AutoEventWireup="true"


CodeBehind="updatepanel.aspx.cs" Inherits="WebApplication2.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 test</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<table border="1">
<asp:UpdatePanel ID="UpdPnlTime" runat="server"
ChildrenAsTriggers="false" UpdateMode="Conditional">
<ContentTemplate>
<tr >
<td style="width:100px;height:30px">
<asp:Label ID="lblTime" runat="server"
Text="Current Time"></asp:Label>

Text=""></asp:Label>

</td>
<td>
<asp:Label ID="lblPrintTime" runat="server"
</td>

</tr>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdPnlBtn" runat="server">
<ContentTemplate>
<tr>
<td style="width:100px;height:30px" colspan="2"
align="center">
<asp:Button ID="btnGetTime" runat="server"
Text="GetTime" OnClick="btnGetTime_Click" />
</td>
</tr>
</ContentTemplate>
</asp:UpdatePanel>
</table>
</div>
</form>
</body>
</html>

The ScriptManager will handle the all AJAX related calls and update panel. As shown
above add the ScriptManager and two update panels, the UpdPnlTime contain the label
and UpdPnlBtn contain the btnGetTime button.
We need to set the update panel attribute UpdateMode as Conditional because no need
to update all the postbacks and ChildrenAsTriggers as false to avoid updates.In the
btnGetTime button click event will get current date and time and assign into the
lblPrintTime label as shown below.

Refresh UpdatePanel using Update method

protected void btnGetTime_Click(object sender, EventArgs e)


{
lblPrintTime.Text = DateTime.Now.ToString();
UpdPnlTime.Update();
}

Update(); method from UpdatePanel will used to update UpdPnlTime panel after assign
the value into label.

Now if you click the GetTime button, the current date and time details are assigned to
the label and Update() method will refresh the UpdPnlTime update panel.

Conclusion

So now we know how to programmatically update the update panel easily.

When UpdatePanel controls are not nested you can update each panel
independently by setting the UpdateMode property to Conditional. (The default
value of theUpdateMode property is Always. This causes the panel to refresh in
response to any asynchronous postback.)
http://www.asp.net/ajax/documentation/live/tutorials/CreatingPageUpdatePanel.aspx

If the UpdateMode property is set to Conditional, the UpdatePanel controls content


is updated when one of the following is true:
When the postback is caused by a trigger for that UpdatePanel control.
When you explicitly call the UpdatePanel control's Update() method.
When the UpdatePanel control is nested inside another UpdatePanel control and the
parent panel is updated.
When the ChildrenAsTriggers property is set to true and any child control of
the UpdatePanel control causes a postback. Child controls of
nested UpdatePanel controls do not cause an update to the
outer UpdatePanel control unless they are explicitly defined as triggers for the
parent panel.

Hi , In the updatepanel updToolBar which you do not want to refresh on button


click btnReferesh the you can set ChildrenAsTrigger = false for updToolbar
updatepanel.

You might also like