UpdatePanel controls partial updates on the page. This update function depends on the EnablePartialRendering attribute of the scriptManger control, if this attribute is set to false, local updates will be ineffective (the default value of the EnablePartialRendering attribute of the scriptManger control is true, so you do not have to set it intentionally)
The following is a complete UpdatePanel structure:
Copy codeThe Code is as follows: <asp: ScriptManager ID = "ScriptManager1" runat = "server">
</Asp: ScriptManager>
<Asp: UpdatePanel ID = "UpdatePanel1" runat = "server" ChildrenAsTriggers = "true" UpdateMode = "Always" RenderMode = "Block">
<ContentTemplate>
</ContentTemplate>
<Triggers>
<Asp: AsyncPostBackTrigger/>
<Asp: PostBackTrigger/>
</Triggers>
</Asp: UpdatePanel>
Main attributes:
1. ChildrenAsTriggers: whether to update the template (related to the conditional of UpdateMode) for sending back of child controls in the content Template)
2. UpdateMode: Content template update mode, which can be either always or conditional.
Always: Each ajax PostBack or normal PostBack operation can cause panel updates. If UpdatePanel is set to Always, the above ChildrenAsTriggers attribute cannot be used. If it is forcibly used, an error is reported, which is the default updatepanel update mode, it is not directly related to trigger setting.
Conditional: The panel content is updated only when the following conditions are met.
If you set UpdateMode = "conditional" ChildrenAsTriggers = "false", the Child control cannot trigger an update.
1) when a widget in the panel triggers PostBack
2) When a Trigger specified by the Panel is triggered
3. RenderMode: displays the partial update control. Block (partial update is displayed as div on the client) and Inline (partial update is displayed as span on the client)
Child element:
1. contentTemplate: Content template of the partial update control. You can add any controls to it.
2. Triggers: a partial update trigger, which includes AsyncPostBackTrigger for local update. Both PostBackTrigger and normal one-stop operations may cause all page updates, regardless of whether a partial update control is used.
Below are a few simple examples:
1. Set updatemode of updatepanel to always.Copy codeThe Code is as follows: <% @ Page Language = "C #" AutoEventWireup = "true" CodeFile = "Default2.aspx. cs" Inherits = "Default2" %>
<! 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> No title page </title>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Div>
</Div>
<Asp: ScriptManager ID = "ScriptManager1" runat = "server">
</Asp: ScriptManager>
<Asp: UpdatePanel ID = "UpdatePanel1" runat = "server" UpdateMode = "Always">
<ContentTemplate>
<% = DateTime. Now. ToString () %>
<Asp: Button ID = "Button1" runat = "server" Text = "UpdatePanelButton"/>
</ContentTemplate>
</Asp: UpdatePanel>
<Asp: Button ID = "Button2" runat = "server" Text = "Button"/>
</Form>
</Body>
</Html>
No matter which button, the update will be triggered, but the page will display the sending back when the outside button is postback!
1. Set updatemode of updatepanel to conditional (ChildrenTriggers = "false" means that events in updatepanel do not trigger updates)Copy codeThe Code is as follows: <% @ Page Language = "C #" AutoEventWireup = "true" CodeFile = "Default2.aspx. cs" Inherits = "Default2" %>
<! 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> No title page </title>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Div>
</Div>
<Asp: ScriptManager ID = "ScriptManager1" runat = "server">
</Asp: ScriptManager>
<Asp: UpdatePanel ID = "UpdatePanel1" runat = "server" UpdateMode = "Conditional" ChildrenAsTriggers = "false">
<ContentTemplate>
<% = DateTime. Now. ToString () %>
<Asp: Button ID = "Button1" runat = "server" Text = "UpdatePanelButton"/>
</ContentTemplate>
</Asp: UpdatePanel>
<Asp: Button ID = "Button2" runat = "server" Text = "Button"/>
</Form>
</Body>
</Html>
The following describes the Trigger of updatePanel.
People who know the database should be clear about the Trigger concept. Trigger is also critical for UpdatePanel.
This section briefly introduces the functions of asyncPostBackTrigger and PostBackTrigger in UpdatePanel.
Here we will give a brief introduction to the examples:
1. PostBackTrigger)
PostBackTrigger mainly targets the child controls in the UpdatePanel template, because when the child control is triggered. It only updates the data in the template, and the controls outside the template do not change. When you need to update the global content, you can use the PostBackTrigger trigger to implement all page callbacks.
The following is a simple example:Copy codeThe Code is as follows: <% @ Page Language = "C #" AutoEventWireup = "true" CodeFile = "Default2.aspx. cs" Inherits = "Default2" %>
<! 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> No title page </title>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Div>
</Div>
<Asp: ScriptManager ID = "ScriptManager1" runat = "server">
</Asp: ScriptManager>
<Asp: UpdatePanel ID = "UpdatePanel1" runat = "server" UpdateMode = "Always">
<ContentTemplate>
<% = DateTime. Now. ToString () %>
<Asp: Button ID = "Button1" runat = "server" Text = "UpdatePanelButton"/>
</ContentTemplate>
<Triggers>
<! -- Comment out the following. click the button in updatePanel to update only the time in the Panel. Cancel the comment to update all comments. -->
<! -- <Asp: PostBackTrigger ControlID = "Button1"/> -->
</Triggers>
</Asp: UpdatePanel>
<Br/>
<% = DateTime. Now. ToString () %>
<Asp: Button ID = "Button2" runat = "server" Text = "Button"/>
</Form>
</Body>
</Html>
2. AsyncPostBackTrigger)
Is the key to implementing local updates. Define the control and events that cause sending back in the trigger.
Example:Copy codeThe Code is as follows: <% @ Page Language = "C #" AutoEventWireup = "true" CodeFile = "Default2.aspx. cs" Inherits = "Default2" %>
<! 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> No title page </title>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Asp: ScriptManager ID = "ScriptManager1" runat = "server">
</Asp: ScriptManager>
<Asp: UpdatePanel ID = "UpdatePanel1" runat = "server" UpdateMode = "Always">
<ContentTemplate>
<% = DateTime. Now. ToString () %>
</ContentTemplate>
<Triggers>
<Asp: AsyncPostBackTrigger ControlID = "Button2" EventName = "Click"/>
</Triggers>
</Asp: UpdatePanel>
<Br/>
<% = DateTime. Now. ToString () %>
<Asp: Button ID = "Button2" runat = "server" Text = "Button"/>
</Form>
</Body>
</Html>
Only the internal time of updatepanel is updated when you click button2.
The above example can also dynamically update some source code of UpdatePanel:
In this example, we will not write the following code:Copy codeThe Code is as follows: protected void Page_Load (object sender, EventArgs e)
{
// Obtain the update control
UpdatePanel mapanel = UpdatePanel1;
// Set the trigger mode
Mapanel. UpdateMode = UpdatePanelUpdateMode. Conditional;
// Display time
Label1.Text = DateTime. Now. ToString ();
// Add trigger
AsyncPostBackTrigger tri = new AsyncPostBackTrigger ();
Tri. ControlID = "Button2 ";
Tri. EventName = "Click ";
Mapanel. Triggers. Add (tri );
}
First record these ~ I hope you can give me more advice.