且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel

更新时间:2022-10-07 14:35:27




本文简单介绍一下在母版页中使用UpdatePanel控件,翻译自官方文档。

 
主要内容
1.添加UpdatePanel控件到Content Page
2.通过Master Page刷新UpdatePanel
 
一.添加UpdatePanel控件到Content-Page
1.添加一个新的Master Page,并切换到设计视图。
2.在工具箱中AJAX Extensions标签下双击ScriptManager控件添加到页面中,确保ScriptManager控件添加在ContentPlaceHolder控件之外。
3.在ContentPlaceHolder控件添加文本“Master Page”。
4.在工具箱的HTML标签下,拖动Horizontal Rule(横线)到文本之后,页面如下:
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel5.创建一个Content Page,选择它的Master Page为我们刚才创建的页面。
在解决方案管理器中点击右键,并选择Add New Item菜单命令,在Add New Item对话框中选择Select master page复选矿,并单击OK按钮。
6.在Content页面中的Content控件中输入Content Page,并添加一个UpdatePanel控件。
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel7.在UpdatePanel控件中添加Calendar控件。
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel8.保存并按Ctrl + F5运行。
9.单击Calendar控件中的上月和下月按钮,页面并没有整页刷新。
二.通过Master Page刷新UpdatePanel
在该例子中我们将在Master Page中添加一些控件,它们将引发一个异步提交,同时在Content页面中刷新UpdatePanel
1.在Master Page中切换到设计视图。
2.添加一些文本和两个按钮到页面中,设置一个按钮的ID属性和Text属性分别为DecrementButton和“-”,设置另一个按钮的ID属性和Text属性分别为IncrementButton和“+”。
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel3.选择+按钮,在属性窗口的Click事件框中输入MasterButton_Click,对-按钮再重复做一次。
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel4.在控件之外双击页面添加Page_Load事件处理。
5.在Page_Load事件处理中添加如下代码,注册两个按钮为异步提交按钮。
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanelprotected void Page_Load(object sender, EventArgs e)
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
{
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    ScriptManager1.RegisterAsyncPostBackControl(DecrementButton);
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    ScriptManager1.RegisterAsyncPostBackControl(IncrementButton);
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel}
6.添加如下代码创建一个MasterButton_Click事件处理。
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanelprotected void MasterButton_Click(object sender, EventArgs e)
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
{
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    
switch (((Control)sender).ID)
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    
{
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel        
case "IncrementButton":
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel            
this.Offset = this.Offset + 1;
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel            
break;
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel        
case "DecrementButton":
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel            
this.Offset = this.Offset - 1;
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel            
break;
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    }

ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    ((UpdatePanel)ContentPlaceHolder1.FindControl(
"UpdatePanel1")).Update();
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    Calendar cal 
= ((Calendar)ContentPlaceHolder1.FindControl("Calendar1"));
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    DateTime newDateTime 
= DateTime.Today.Add(new TimeSpan(Offset, 000));
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    cal.SelectedDate 
= newDateTime;
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel}
7.在Master Page中创建一个公有的属性Offset,来显示所选择的日期和当天之差。
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanelpublic Int32 Offset
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
{
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    
get
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    
return (Int32)(ViewState["Offset"?? 0); }
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    
set
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    
{ ViewState["Offset"= value; }
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel}
8.在Content Page中,切换到设计视图并双击Calendar控件添加一个SelectionChanged事件处理,当用户选择日期时设置Offset属性。
9.添加如下代码到SelectionChanged事件处理中。
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanelprotected void Calendar1_SelectionChanged(object sender,EventArgs e)
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
{
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    DateTime selectedDate 
= Calendar1.SelectedDate;
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    Master.Offset 
=
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel       ((TimeSpan)Calendar1.SelectedDate.Subtract(
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel       DateTime.Today)).Days;
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel}
10.在Content Page页面的Page_Load事件中添加如下代码。
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanelprotected void Page_Load(object sender, EventArgs e)
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
{
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    DateTime newDateTime 
=
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel        DateTime.Today.Add(
new
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel        TimeSpan(Master.Offset, 
000));
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel    Calendar1.SelectedDate 
= newDateTime;
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel}
11.添加@ MasterType标记到页面中,以便可以作为强类型属性引用Master Page页面的Offset属性。
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel<%@ MasterType VirtualPath="MasterPage.master" %>
12.在Content Page中切换到设计视图,并选择UpdatePanel控件。
13.在属性窗口中设置UpdateModeConditional
ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel14.保存并按Ctrl + F5运行。
15.在Calendar控件中单击上一月和下一月按钮,可以看到整页刷新。
16.选择一个日期并单击Master Page中的按钮,可以看到仍然没有整页刷新。








本文转自lihuijun51CTO博客,原文链接: http://blog.51cto.com/terrylee/67719,如需转载请自行联系原作者