最近评论
正在载入评论列表...
2.5 使用Panel控件
Panel控件用于处理一组ASP.NET控件。
比如，可以用Panel控件来隐藏或显示一组ASP.NET控件。代码清单2-29中的页面包含一列RadioButton控件，用于选择最喜欢的编程语言。最后一个RadioButton标注为Other。如果选择Other单选按钮，就会显示Panel控件的内容（见图2-18）。
图2-18 用Panel控件隐藏和显示控件
代码清单2-29 ShowPanel.aspx
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void btnSubmit_Click(object sender, EventArgs e)
{
if (rdlOther.Checked)
pnlOther.Visible = true;
else
pnlOther.Visible = false;
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Show Panel</title>
</head>
<body>
<form id="form1" runat="server">
<div>
Select your favorite programming language:
<br /><br />
<asp:RadioButton
id="rdlVisualBasic"
GroupName="language"
Text="Visual Basic"
Runat="server" />
<br /><br />
<asp:RadioButton
id="rdlCSharp"
GroupName="language"
Text="C#"
Runat="server" />
<br /><br />
<asp:RadioButton
id="rdlOther"
GroupName="language"
Text="Other Language"
Runat="server" />
<br />
<asp:Panel
id="pnlOther"
Visible="false"
Runat="server">
<asp:Label
id="lblOther"
Text="Other Language:"
AssociatedControlID="txtOther"
Runat="server" />
<asp:TextBox
id="txtOther"
Runat="server" />
</asp:Panel>
<br /><br />
<asp:Button
id="btnSubmit"
Text="Submit"
Runat="server" OnClick="btnSubmit_Click" />
</div>
</form>
</body>
</html>
注意，Panel控件的声明带有一个值设为False的Visible属性。因为Visible设成了Flase，所以请求页面时，不会呈现Panel控件和包含在Panel控件中的所有控件。
如果选择了标注为Other的RadioButton控件，Visible属性的值设为True，Panel控件的内容就会显示出来。
注解 所有ASP.NET Framework中的控件都支持Visible属性。Visible设为False，控件则不会呈现其内容。
Panel控件支持下列属性（不完全列表）：
q DefaultButton——用于指定Panel中的默认按钮。按下回车键就会调用默认按钮。
q Direction——用于获取或设置在 Panel 控件中显示那些包含文本的控件的方向。可能的值有NotSet、LeftToRight和RightToLeft。
q GroupingText——把Panel控件呈现为一个带特殊legend的字段集。
q HorizontalAlign——用于指定窗格中内容的横向对齐方式。可能的值有Center、Justify、Left、NotSet和Right。
q ScrollBars——用于在窗格内容周围显示滚动条。可能的值有Auto、Both、Horizontal、None和Vertical。
默认情况下，Panel控件生成<div>标签包围其内容。如果设置了GroupingText属性，Panel控件生成<filedset>标签。设给GroupingText属性的值出现在<fieldset>标签的<legend>标签中。代码清单2-30演示了如何使用GroupingText属性（见图2-19）。
代码清单2-30 PanelGroupingText.aspx
<%@ Page Language="C#" %>
<!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 id="Head1" runat="server">
<title>Panel Grouping Text</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Panel
id="pnlContact"
GroupingText="Contact Information"
Runat="server">
<asp:Label
id="lblFirstName"
Text="First Name:"
AssociatedControlID="txtFirstName"
Runat="server" />
<br />
<asp:TextBox
id="txtFirstName"
AutoCompleteType="FirstName"
Runat="server" />
<br /><br />
<asp:Label
id="lblLastname"
Text="Last Name:"
AssociatedControlID="txtLastName"
Runat="server" />
<br />
<asp:TextBox
id="txtLastName"
AutoCompleteType="LastName"
Runat="server" />
<br /><br />
<asp:Button
id="btnSubmit"
Text="Submit"
Runat="server" />
</asp:Panel>
</div>
</form>
</body>
</html>
图2-19 设置GroupingText属性
Web标准注解 依照辅助功能手册，应该使用<filedset>标签分组长表单中的表单字段。
ScrollBars属性用于在窗格的内容周围显示滚动条。比如，代码清单2-31中的页面有一个Panel控件，包含显示100个条目的BulletedList控件。Panel控件配置成当它的内容超出其宽和高时滚动（见图2-20）。
图2-20 显示Panel控件滚动条
代码清单2-31 PanelScrollBars.aspx
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
void Page_Load()
{
for (int i = 0; i < 100; i++)
bltList.Items.Add("Item " + i.ToString());
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<style type="text/css">
html
{
background-color:silver;
}
.contents
{
background-color:white;
width:200px;
height:200px;
}
</style>
<title>Panel ScrollBars</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Panel
id="pnlContent"
ScrollBars="Auto"
CssClass="contents"
Runat="server">
<asp:BulletedList
id="bltList"
Runat="server" />
</asp:Panel>
</div>
</form>
</body>
</html>
|
启用Panel控件的滚动条，必须指定具体的宽和高来显示滚动条。代码清单2-31中，使用CSS来指定宽和高。此外，也可以通过Panel控件的Width和Height属性来指定宽和高。
图书导读
