ASP.net Ajax Learning series Powerful UpdatePanel controls

Source: Internet
Author: User
Tags add datetime net tostring
Ajax|asp.net| Control

Let's give a simple example, and then give a more complicated example.

The improved UpdatePanel makes page partial updates (partial-page Updates) very easy to implement.
It's easy to add some updates to an existing Web page or new page, and here are a few steps:
<1> Add the ScriptManager control to the page. and ensure that the EnablePartialRendering property value of the ScriptManager control is true. If enablepartialrendering=false, any settings that are made to the partial update of the page below will not be implemented. The default value for the enablepartialrendering is true, and no modification is done.

<asp:scriptmanager id= "ScriptManager1" runat= "Server" >
</asp:ScriptManager>

<2> Add the UpdatePanel control to the page. Add some content that you want to update in <ContentTemplate></ContentTemplate>.


<asp:updatepanel id= "UpdatePanel1" runat= "Server" >
<ContentTemplate>
<fieldset>
<legend>in updatepanel</legend>
UpdatePanel content refreshed at <%=datetime.now.tostring ()%>
<asp:button id= "Button1" text= "Refreshupdatepanel" runat= "Server"/>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
For comparison, add a line of code outside the UpdatePanel

<div>out of updatepanel,refreshed at <%=datetime.now.tostring ()%></div>
This part of the update function is realized, may not believe.
Let's see the effect.

Two parts update time is not the same!

The function of the UpdatePanel control is very powerful. This is the simplest application.
In a partial update, the data submitted to the server is no different from the general postback, and all data, including ViewState, is passed back to the server. The difference is that the data from the server is returned only partially updated. As a result of the introduction of the UpdatePanel control, postback is divided into two types, asynchronous postback and normal postback,asynchronous postback to cause UpdatePanel updates, Normal postback raises an entire page update. You can use the ScriptManager isInAsyncPostBack property to determine the type of postback.
Introduce the properties of UpdatePanel.
<1>triggers
There are two kinds of asyncpostbacktrigger,postbacktrigger.
Asyncpostbacktrigger
To specify that an event of a control will cause an asynchronous postback (asynchronous postback), or a partial update. Properties are ControlID and eventname. Used to specify control IDs and control events, and to automatically take the default value of the control without explicitly specifying the eventname value, such as the button is click. Setting the contorlid to the ID of the UpdatePanel external control allows the external control to control the UpdatePanel update.
Postbacktrigger
To specify that a control within UpdatePanel raises an entire page update (normal postback).

<Triggers>
<asp:postbacktrigger controlid= "Button1"/>
<asp:asyncpostbacktrigger controlid= "Button2" eventname= "click"/>
</Triggers>
<2>updatemode
Has two values: Always,conditional. Always update, conditional update.
Determines whether the update is always updated when asynchronous postbacks occurs. If there is only one UpdatePanel control on the page, this value does not seem to have any meaning. However, when there are multiple UpdatePanel in the page, or the complexity of the UpdatePanel contains UpdatePanel, the setting of this value allows each UpdatePanel to be updated at various opportune times.
<3>childerastriggers
BOOL value, which is true by default. If set to False, the UpdatePanel child control throws an asynchronous postback (asynchronous postback), but does not update the current UpdatePanel (found on multiple UpdatePanel pages). It's more difficult to understand, even if I understand it is wrong. Please advise the master.
This property is only meaningful under updatemode=conditional conditions. An exception is thrown when the right UpdateMode is always,childerastriggers=false.

Additionally, UpdatePanel provides a method update () that can be updated partially by code controls.
Say so much first. Here's a code that uses these properties.


<%@ Page language= "C #"%>
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<script runat= "Server" >

protected void Button4_Click (object sender, EventArgs e)
{
Updatepanel1.update ();
}
</script>
<title>untitled page</title>
<style type= "Text/css" >
. Updatepaneltitle
{
color:red;
}
</style>
<body>
<form id= "Form1" runat= "Server" >
<div>
<asp:scriptmanager id= "ScriptManager1" runat= "Server" >
</asp:ScriptManager>

<fieldset>
<legend class= "Updatepaneltitle" >updatepanel controls </legend>
<asp:button runat= "Server" id= "Button5" text= "trigger regular return"/><br
<asp:button runat= "Server" id= "Button1" text= "initiate asynchronous postback"/><br
Refrest at <%=datetime.now.touniversaltime ()%>
</fieldset>

<asp:updatepanel id= "UpdatePanel1" updatemode= "Conditional" runat= "Server" >
<Triggers>
<asp:postbacktrigger controlid= "Button2"/>
</Triggers>
<ContentTemplate>
<fieldset>
<legend class= "Updatepaneltitle" >UpdatePanel1</legend>
<asp:button runat= "Server" id= "Button2" text= "triggers a regular postback"/>
Refresh at <%=datetime.now.touniversaltime ()%>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>


<asp:updatepanel id= "UpdatePanel2" updatemode= "Conditional" runat= "Server" >
<Triggers>
<asp:asyncpostbacktrigger controlid= "Button1"/>
</Triggers>
<ContentTemplate>
<fieldset>
<legend class= "Updatepaneltitle" >UpdatePanel2</legend>
<asp:button runat= "Server" id= "Button3" text= "InPanel2"/>
Refresh at <%=datetime.now.touniversaltime ()%><br/>

<asp:updatepanel id= "UpdatePanel3" runat= "Server" updatemode= "Always" >
<ContentTemplate>
<fieldset>
<legend class= "Updatepaneltitle" >updatepanel3:i ' m Child of Updatepanel2</legend>
<asp:button runat= "Server" id= "Button4" text= "InPanel3"/>
Refresh at <%=datetime.now.touniversaltime ()%>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
</fieldset>

</ContentTemplate>
</asp:UpdatePanel>

<asp:updatepanel id= "UpdatePanel4" updatemode= "Conditional" runat= "Server" childrenastriggers= "false" >
<ContentTemplate>
<fieldset>
<legend class= "Updatepaneltitle" >UpdatePanel4</legend>
<asp:button runat= "Server" id= "Button6" text= "causes regular postbacks, but does not update itself"/>
Refresh at <%=datetime.now.touniversaltime ()%>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>

</div>
</form>
</body>
Http://www.cnblogs.com/sharpaxe/archive/2006/10/25/539867.html



Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.