ASP.net中的AJAX学习记录五:动态加载用户控件(Calendar控件为例)

简介:
     这篇博客主要是一个动态加载用户控件的实例,页面效果是当用户点击按钮时,出现日历控件(用户自定义控件,包括每个月的1日出现“发工资”的提示),对日历进行操作时,不影响整个页面(无刷新),当用户再次点击按钮时,用户控件卸载。以前我的一个日历的实例中也实现了这个效果,但是那时使用的是整体用户控件加载,并且不卸载功能,当用户点击按钮时,出现的日历出现和消失都是采用Visible方法,这无疑加重了页面的负担,今天学习到了这种方法,记录下来,供日后回顾。
     首先我们先来布置页面:
    1.在网站下添加新项用户控件,默认其页面名: WebUserControl.ascx
    2.在 WebUserControl.ascx中添加一个日历控件,按照自己喜欢的样式改变其外观。
    这里我想说明两个Calendar控件的属性,让我们一起来重温Calendar控件,首先Calendar控件默认可以选择日期,可以使用 SelectionMode属性修改这个选择操作,这个属性的值可以是Day(允许在日历中单击某个日期)、DayWeek(允许在日历中单击某个日期,同时可以单击星期旁边的箭头,选择整个星期)、DayWeekMonth(可以选择日期或星期,日历右上角的箭头允许选择整个月)、none(用户不能做任何操作)。接着:day属性的一个有用的功能是,可以把Day属性的 IsSelectable设置为false,关闭选择某个日期或日期范围的选项。这个功能在实际开发中,可能会用到,代码如下:
if(e.Day.Date<DateTime.Now)
    e.Day.IsSelectable=false;
    3.编写每个月1日时日历出现的“发工资”的提示,代码如下:
InBlock.gif 1using System; 
InBlock.gif 2using System.Collections; 
InBlock.gif 3using System.Configuration; 
InBlock.gif 4using System.Data; 
InBlock.gif 5using System.Linq; 
InBlock.gif 6using System.Web; 
InBlock.gif 7using System.Web.Security; 
InBlock.gif 8using System.Web.UI; 
InBlock.gif 9using System.Web.UI.HtmlControls; 
InBlock.gif10using System.Web.UI.WebControls; 
InBlock.gif11using System.Web.UI.WebControls.WebParts; 
InBlock.gif12using System.Xml.Linq; 
InBlock.gif13 
InBlock.gif14public partial  class WebUserControl : System.Web.UI.UserControl 
InBlock.gif15{ 
InBlock.gif16         protected  void Page_Load( object sender, EventArgs e) 
InBlock.gif17        { 
InBlock.gif18 
InBlock.gif19        } 
InBlock.gif20         //DayRender:日历中显示的每一天都会运行该方法。 
InBlock.gif21         protected  void Calendar1_DayRender( object sender, DayRenderEventArgs e) 
InBlock.gif22        {    
InBlock.gif23                 //单元格的垂直对齐方式为top 
InBlock.gif24                e.Cell.VerticalAlign = VerticalAlign.Top; 
InBlock.gif25                 if (e.Day.DayNumberText ==  "1"
InBlock.gif26                { 
InBlock.gif27                        e.Cell.Controls.Add( new LiteralControl ( "<p>发工资</p>")); 
InBlock.gif28                        e.Cell.BorderColor = System.Drawing.Color.Black; 
InBlock.gif29                        e.Cell.BorderWidth = 1; 
InBlock.gif30                        e.Cell.BorderStyle = BorderStyle.Double; 
InBlock.gif31                        e.Cell.BackColor = System.Drawing.Color.LightGray; 
InBlock.gif32                } 
InBlock.gif33        } 
InBlock.gif34}
         4.新建一个AJAX窗口,命名为: DynamicLoadControl.aspx,在页面中放置一个Updatepanel1。
         5.在Updatepanel1中放入一个Button1,text=“…”(18行)。
         6. 在Updatepanel1中放入一个html的 hidden控件,将其改为服务器控件,id改为: Dynamic_UserControl_Hidden1(17行)
页面布局介绍,下面我们来看一下 DynamicLoadControl.aspx的客户端代码
1 < head  runat ="server" > 
2         < title >无标题页 </title> 
3         < script  type ="text/javascript" >     
4            function pageLoad() { 
5            } 
6         
7         </script> 
8 </head> 
9 < body > 
10         < form  id ="form1"  runat ="server" > 
11         < div > 
12         
13                 < asp:ScriptManager  ID ="ScriptManager1"  runat ="server" > 
14                 </asp:ScriptManager> 
15                 < asp:UpdatePanel  ID ="UpdatePanel1"  runat ="server"  UpdateMode ="Conditional" > 
16                         < ContentTemplate > 
17                                 < input  ID ="Dynamic_UserControl_Hidden1"  type ="hidden"  runat ="server"  /> 
18                                 < asp:Button  ID ="Button1"  runat ="server"  Text ="…"  onclick ="Button1_Click" />                                 
19                         </ContentTemplate> 
20                         < Triggers > 
21                                 < asp:AsyncPostBackTrigger  ControlID ="Button1"  EventName ="Click"  /> 
22                         </Triggers> 
23                 </asp:UpdatePanel> 
24         </div> 
25         </form> 
26 </body> 
27 </html>
下面是cs代码,
InBlock.gif 1using System; 
InBlock.gif 2using System.Collections; 
InBlock.gif 3using System.Configuration; 
InBlock.gif 4using System.Data; 
InBlock.gif 5using System.Linq; 
InBlock.gif 6using System.Web; 
InBlock.gif 7using System.Web.Security; 
InBlock.gif 8using System.Web.UI; 
InBlock.gif 9using System.Web.UI.HtmlControls; 
InBlock.gif10using System.Web.UI.WebControls; 
InBlock.gif11using System.Web.UI.WebControls.WebParts; 
InBlock.gif12using System.Xml.Linq; 
InBlock.gif13 
InBlock.gif14public partial  class DynamicLoadControl : System.Web.UI.Page 
InBlock.gif15{ 
InBlock.gif16         protected  void Page_Load( object sender, EventArgs e) 
InBlock.gif17        { 
InBlock.gif18             
InBlock.gif19        } 
InBlock.gif20         //这个方法先于page_load之前执行,也在控件初始化前执行 
InBlock.gif21         protected  void Page_Init( object sender, EventArgs e) 
InBlock.gif22        { 
InBlock.gif23                 //从送来的参数中,判断用户控件是否已经加载,"Dynamic_UserControl_Hidden1"是个标志, 
InBlock.gif24                 //为true时,代表用户控件存在,初次加载页面时,表示是false,故没有用户控件出现在网页上 
InBlock.gif25                 if (Request.Params[ "Dynamic_UserControl_Hidden1"] ==  " true"
InBlock.gif26                        LoadDynamicUserControl(); 
InBlock.gif27 
InBlock.gif28        } 
InBlock.gif29         //点击按钮出现用户自定义控件 
InBlock.gif30         protected  void Button1_Click( object sender, EventArgs e) 
InBlock.gif31        { 
InBlock.gif32                 //当用户自定义控件(标志为true)存在时,就移除到自定义控件,同时标志改为false。 
InBlock.gif33                 if (Request.Params[ "Dynamic_UserControl_Hidden1"] ==  "true"
InBlock.gif34                { 
InBlock.gif35                        UpdatePanel1.ContentTemplateContainer.Controls.Remove(UpdatePanel1.ContentTemplateContainer.FindControl( "WebUserControl1")); 
InBlock.gif36                        HtmlInputHidden hidden = (HtmlInputHidden)UpdatePanel1.ContentTemplateContainer.FindControl( "Dynamic_UserControl_Hidden1"); 
InBlock.gif37                        hidden.Value =  "false"
InBlock.gif38 
InBlock.gif39                } 
InBlock.gif40                         //否则就加载用户自定义控件 
InBlock.gif41                 else 
InBlock.gif42                        LoadDynamicUserControl(); 
InBlock.gif43        } 
InBlock.gif44         //加载用户自定义控件 
InBlock.gif45         private  void LoadDynamicUserControl() 
InBlock.gif46        { 
InBlock.gif47                 //当Updatepanel中没有用户控件时 
InBlock.gif48                 if (UpdatePanel1.ContentTemplateContainer.FindControl( "WebUserControl1") ==  null
InBlock.gif49                { 
InBlock.gif50                         //根据指定的WebUserControl.ascx路径加载控件WebUserControl1 
InBlock.gif51                        Control c = LoadControl( "WebUserControl.ascx"); 
InBlock.gif52                        c.ID =  "WebUserControl1"
InBlock.gif53                         //找到标志将其值改为true 
InBlock.gif54                        HtmlInputHidden hidden =(HtmlInputHidden ) UpdatePanel1.ContentTemplateContainer.FindControl( "Dynamic_UserControl_Hidden1"); 
InBlock.gif55                        hidden.Value =  "true"
InBlock.gif56                         //在Updatepanel中加入用户控件 
InBlock.gif57                        UpdatePanel1.ContentTemplateContainer.Controls.Add(c);             
InBlock.gif58                } 
InBlock.gif59        } 
InBlock.gif60         
InBlock.gif61}
本文转自叶子文文博客51CTO博客,原文链接http://blog.51cto.com/leafwf/185631如需转载请自行联系原作者

叶子文文
相关文章
|
3月前
|
开发框架 前端开发 JavaScript
盘点72个ASP.NET Core源码Net爱好者不容错过
盘点72个ASP.NET Core源码Net爱好者不容错过
71 0
|
3月前
|
开发框架 .NET
ASP.NET Core NET7 增加session的方法
ASP.NET Core NET7 增加session的方法
37 0
|
1月前
|
开发框架 前端开发 .NET
进入ASP .net mvc的世界
进入ASP .net mvc的世界
29 0
|
1月前
|
XML 开发框架 .NET
C# .NET面试系列八:ADO.NET、XML、HTTP、AJAX、WebService
## 第二部分:ADO.NET、XML、HTTP、AJAX、WebService #### 1. .NET 和 C# 有什么区别? .NET(通用语言运行时): ```c# 定义:.NET 是一个软件开发框架,提供了一个通用的运行时环境,用于在不同的编程语言中执行代码。 作用:它为多语言支持提供了一个统一的平台,允许不同的语言共享类库和其他资源。.NET 包括 Common Language Runtime (CLR)、基础类库(BCL)和其他工具。 ``` C#(C Sharp): ```c# 定义: C# 是一种由微软设计的面向对象的编程语言,专门为.NET 平台开发而创建。 作
174 2
|
2月前
|
SQL 开发框架 前端开发
ASP.NET WEB项目中GridView与Repeater数据绑定控件的用法
ASP.NET WEB项目中GridView与Repeater数据绑定控件的用法
34 0
|
3月前
|
SQL 开发框架 JavaScript
分享33个ASP.NET电子商务源码和40个ASP.NET控件组件源码,总有一款适合您
分享33个ASP.NET电子商务源码和40个ASP.NET控件组件源码,总有一款适合您
29 0
|
4月前
|
JavaScript C#
【傻瓜级JS-DLL-WINCC-PLC交互】2.wincc使用C#开发的.net控件
【傻瓜级JS-DLL-WINCC-PLC交互】2.wincc使用C#开发的.net控件
41 0
|
4月前
|
JavaScript Linux C#
【傻瓜级JS-DLL-WINCC-PLC交互】1.C#用windows窗体控件创建.net控件
【傻瓜级JS-DLL-WINCC-PLC交互】1.C#用windows窗体控件创建.net控件
65 0
|
4月前
|
开发框架 .NET 数据安全/隐私保护
Asp.Net第二章服务器端控件
Asp.Net第二章服务器端控件
27 0
|
4月前
|
开发框架 JavaScript .NET
Asp.Net就业课之三验证控件
Asp.Net就业课之三验证控件
44 0

相关实验场景

更多