第2章 ASP NET常用服务器标准控件3

2.1.6 容器控件
1．Panel控件 语法格式如下： <asp:Panel ID="Panel1" runat="server" Height="控件的 高" Width="控件的宽" … > 其他控件 </asp:Panel>


【演练2-9】 Panel控件应用示例，模仿Word中的“查找” 对话框，如图2-25所示。
③ 编写事件代码。 【演练2-12】代码


2.1.8 动态生成控件
Web服务器控件可以在设计视图中添加到页面中，也可以 在程序运行到一定时候或者触发某个事件之后动态生成。 动态生成控件的语法格式为： 控件名称 动态生成控件实例 = new 控件名称(); 动态生成的控件要添加到容器控件（如Panel控件）中，语 法格式为： 容器控件ID.Controls.Add(动态生成控件实例); 动态生成的控件也可能需要添加处理事件。



在解决方案资源管理器中，右击网站名称“C:\ex2_11”， 在快捷菜单中单击“新建文件夹”，在网站中新建 UploadedImages文件夹，用于保存上传到服务器中的图像 文件，如图2-29所示。


② 编写事件代码。 在Default.aspx设计视图中，双击“上传图片”按钮，打开 Default.aspx.cs代码窗口，编写Button1的Click事件过程代码 【演练2-11】代码 ③ 运行网站。单击“启用调试”按钮 ，运行当前Web窗 体，显示如图2-30所示。单击“浏览”按钮，显示“选择 要加载的文件”对话框（可浏览图片库中的示例图片）， 双击一个图片文件。单击“上传图片”按钮后，显示如图 2-31所示。


编写Web窗体Default.aspx装入时执行的事件过程代码如下 ： protected void Page_Load(object sender, EventArgs e) { this.Title = "使用用户控件示例"; Label1.Text = "使用用户控件制作的Web导航栏"; Label1.Font.Name = "楷体_GB2312"; Label1.Font.Size = 18; } 运行Default.aspx，显示如图2-42所示。



【演练2-13】 本例单击按钮将动态生成按钮或文本框。在 设计视图中，添加两个Button控件、一个Panel控件，并设 置其Text属性等，如图2-37所示。运行网页如图2-38所示。






“动态生成按钮”按钮控件的单击事件代码如下： protected void Button1_Click(object sender, EventArgs e) { Button myButton = new Button(); //使用new创 建对象实例 myButton.Text = "这是动态生成的按钮"; //设置其Text属性 Panel1.Controls.Add(myButton); //添加到页面 中 } “动态生成文本框”按钮控件的单击事件代码如下： protected void Button2_Click(object sender, EventArgs e) { TextBox myTextBox = new TextBox(); myTextBox.Text = "这是动态生成的文本框"; Panel1.Controls.Add(myTextBox); //添加到容器 控件Panel1中 }





在用户控件窗体设计视图中的空白处双击，打开NavigationBar.ascx.cs 窗口，编写用户控件加载时执行的事件代码如下： protected void Page_Load(object sender, EventArgs e) { LinkButton1.Text = "首页"; LinkButton1.PostBackUrl = "Default.aspx"; LinkButton2.Text = "腾讯网"; LinkButton2.PostBackUrl = "http://www.qq.com/"; LinkButton3.Text = "MSN网"; LinkButton3.PostBackUrl = "http://cn.msn.com/"; LinkButton4.Text = "TOM网"; LinkButton4.PostBackUrl = "http://www.tom.com/"; LinkButton5.Text = "凤凰网"; LinkButton5.PostBackUrl = "http://www.ifeng.com/"; }

3．HiddenField控件 语法格式如下： <asp:HiddenField ID="HiddenField1" runat="server" onvaluechanged="HiddenField1_ValueChanged" Value="值" /> 虽然不显示隐藏字段中的信息，但用户可通过查看页面的 源来查看此控件的内容。注意：不要在HiddenField控件中 存储重要信息，如用户ID、密码或信用卡信息。

5．Calendar控件

【演练2-12】 Calendar控件常被用作ASP.NET网页中提供 日期选择输入的工具，通过本控件的SelectedDate属性获取 或设置用户选择的日期，通过SelectionChanged事件选择一 天、一周或整月时发生的事件。使用Calendar控件，配合 Panel控件和下拉列表框控件，设计一个用于选择日期的 Web程序。打开页面时，屏幕显示如图2-32所示。用户单 击“显示日历”或选择了年份和月份后，页面中显示如图 2-33所示的Calendar控件，用户选择控件中的某个日期后， Calendar控件自动隐藏，屏幕显示如图2-34所示，日期信息 显示在标签控件中。 要求：当“年”下拉列表框、“月”下拉列表框中均为具 体数值时，显示Calendar控件，并且在控件中显示下拉列 表框所指定的年、月设置。

② 编写事件代码。编写Page_Load的事件过程代码如下： protected void Page_Load(object sender, EventArgs e) { TextBox MyTextBox = new TextBox(); MyTextBox.Text = "动态生成的文本框"; PlaceHolder1.Controls.Add(MyTextBox); Button MyButton = new Button(); MyButton.Text = "动态生成的按钮"; PlaceHolder1.Controls.Add(MyButton); }

② 设置对象属性。设置下拉列表框DropDownList1的ID属性为 selectYear，在“ListItem集合编辑器”中添加一个成员，Text和Value属 性均为“-选择年份-”。设置下拉列表框DropDownList2的ID属性为 selectMonth，添加一个选项“-选择月份-”。设置LinkButton1的ID属 性为displayCalendar，Text属性为“显示日历”。Panel1的ID属性为 panelCalendar。Label1的ID属性为message，清除Text属性中的内容。 Calendar1的ID属性为myCalendar，外观用“专业型2”。设置属性后的 控件如图2-36所示。控件的其他初始属性在运行时通过代码设置。


（2）把用户控件添加到Web窗体中 添加Web窗体Default.aspx，切换到设计视图，添加一个用 于页面布局的固定宽度为810像素的、3行1列的HTML表格 。从解决方案资源管理器窗口中，向表格第1行中拖入一 张logo.jpg图片，第3行中添加一个Label控件。 把用户控件NavigationBar.ascx拖动到页面中表格的第2行中 ，如图2-41所示。

用户控件创建后，可以像对待其他Web窗体一样向用户控 件界面中添加各种HTML或Web标准控件，双击用户控件 中的标准控件可自动切换到代码窗口，创建事件处理程序 。 切换到设计视图。向该用户控件中添加一个固定宽度为 800像素的、1行5列的HTML表格。向表格中添加5个 LinkButton控件，设置各控件在单元格中居中对齐，如图240所示。

① 设计页面。新建空网站，添加Web窗体，切换到设计视 图，在Default.aspx中添加两个Panel控件。在上面的Panel1 控件中插入一个用于布局的3行2列、固定宽度450像素的 HTML表格，向表格中添加一个TextBox控件和3个Button 控件。在下面的Panel2控件中插入一个用于布局的2行2列 、固定宽度450像素的表格，向表格中添加一个 DropDownList控件和一个CheckBoxList控件。适当调整表 格、各控件的大小和位置。因为在设计视图中通过拖动方 式不容易把两个Panel控件调整为相同的宽度，所以，建议 在源视图中更改控件的Width属性值为500px。Web窗体的 设计视图如图2-26左图所示。

Baidu Nhomakorabea


2.1.7 其他专用控件
1．FileUpload控件 语法格式如下： <asp:FileUpload ID="FileUpload1" runat="server" /> 【演练2-11】 FileUpload控件应用示例。本代码根据允许 的文件扩展名的编码列表检查要上传文件的文件扩展名， 并拒绝所有其他类型的文件。然后，将该文件写入当前网 站的UploadedImages文件夹中，并用被上传文件在客户端 计算机中的文件名保存该文件。 ① 设计页面。新建空网站“C:\ex2_11”，添加Web窗体， 切换到设计视图，在Default.aspx中添加一个FileUpload控件 、一个Button控件、两个Label控件。设置Button控件的 Text属性为“上传图片”，两个Label控件的Text属性均清 空。如图2-29所示。

② 设置页面中各控件对象的属性，见表2-22。其中 DropDownList和CheckBoxList列表框控件使用ListItem集合 编辑器添加选项。设置完的页面如图2-26右图所示。

③ 编写事件代码。 【演练2-9】代码



2．PlaceHolder控件 语法格式如下： <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder> 【演练2-10】 PlaceHolder控件应用示例。在PlaceHolder控 件中动态生成一个TextBox控件和一个Button控件，如图227所示。 ① 设计页面。新建空网站，添加Web窗体，切换到设计视 图，在Default.aspx中添加一个PlaceHolder控件，如图2-28 所示。


① 设计页面。新建空网站“C:\ex2_12”，添加Web窗体， 在Default.aspx的设计视图中添加一个链接按钮控件 LinkButton1，两个下拉列表框控件DropDownList1、 DropDownList2，一个容器控件Panel1，一个标签控件 Label1，然后向Panel1中添加一个月历控件Calendar1，如图 2-35所示。
2.2 Web用户控件



2.2.1 创建用户控件 【演练2-14】 使用用户控件设计一个网页中常见的导航栏 。使用用户控件来实现页面导航栏制作的好处在于，站点中 所有页面都可以方便地调用该用户控件，使所有页面具有相 同风格的外观。 （1）新建用户控件 新建空网站“C:\ex2_14”。在解决方案资源管理器中，右击 项目名称，在快捷菜单中单击“添加新项”，显示“添加新项” 对话框，选择模板为“Web用户控件”，在“名称”框中输 入新的名称，如NavigationBar.ascx，然后单击“添加”按钮 ，如图2-39所示。