通常我們看到局部刷新就會想到Ajax,但是我今天要說的是c#的一個控件,只要把服務器按鈕和要刷新的區域放在該控件內就能實現局部刷新。
當然它必須和ScriptManager控件一起使用。
UpdatePanel重要的屬性如下:
|
屬性
|
說明
|
|
ChildrenAsTriggers
|
當UpdateMode屬性為Conditional時,UpdatePanel中的子控件的異步回送是否會引發UpdatePanle的更新。
|
|
RenderMode
|
表示UpdatePanel最終呈現的HTML元素。Block(默認)表示<div>,Inline表示<span>
|
|
UpdateMode
|
表示UpdatePanel的更新模式,有兩個選項:Always和Conditional。Always是不管有沒有Trigger,其他控件都將更新該UpdatePanel,Conditional表示只有當前UpdatePanel的Trigger,或ChildrenAsTriggers屬性為true時當前UpdatePanel中控件引發的異步回送或者整頁回送,或是服務器端調用Update()方法才會引發更新該UpdatePanel。
|
下面我們來個小實例:
前端代碼:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm4.aspx.cs" Inherits="WebApplication2.WebForm4" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>UpdatePanel局部刷新</title>
<script src="http://apps.bdimg.com/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
//document.getElementById("Button2").click(fun);
function fun() {
document.getElementById("Button2").setAttribute("checked", "checked");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server" >
<ContentTemplate>
<fieldset>
<legend>UpdatePanel content</legend>
<!-- Other content in the panel. -->
<input type="checkbox" checked="checked" />
<input id="ch" type="checkbox" />
<input type="checkbox" checked="checked" />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button2" runat="server" Text="Button" OnClick="ccc" OnClientClick="return fun()" />
<iframe id="iframesun" runat="server" style="width:100%;height:944px"></iframe>
</fieldset>
</ContentTemplate>
</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 WebApplication2
{
public partial class WebForm4 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
public void ccc(object sender, EventArgs e) {
this.TextBox1.Text= "你好UpdatePanel";
this.iframesun.Attributes.Add("src", "https://www.baidu.com/");
}
}
}
這樣我們實現了,不刷新整個頁面,得到TextBox1賦值,和加載了一個百度的iframe。
