ASP.NET Tutorial/ASP.net Controls/Panel
Содержание
- 1 Hide, show panel
- 2 Important properties, methods and events of Panel control
- 3 Set AssociatedControlID for asp:Panel
- 4 The Panel control enables you to work with a group of ASP.NET controls: show or hide
- 5 The ScrollBars property enables you to display scrollbars around a panel
- 6 Use asp:panel to host asp.net controls
Hide, show panel
<%@Page language="c#" runat="server" %>
<script runat="server">
protected void Page_Load(object o, EventArgs e) {
step1.Visible = false;
step2.Visible = false;
step3.Visible = false;
if(!IsPostBack) {
step1.Visible = true;
return;
}
}
protected void ClickStep1(object o, EventArgs e) {
step2.Visible = true;
}
protected void ClickStep2(object o, EventArgs e) {
theFinalName.Text = theName.Text;
theFinalHobby.Text = theHobby.Text;
step3.Visible = true;
}
</script>
<form runat="server">
<asp:panel id="step1" runat="server">
Name: <asp:textbox id="theName" runat="server" />
<asp:button type="submit" id="submitStep1" runat="server" Text="Go" onClick="ClickStep1"/>
</asp:panel>
<asp:panel id="step2" runat="server">
Hobby: <asp:textbox id="theHobby" runat="server"/>
<asp:button type="submit" id="submitStep2" runat="server" Text="Go" onclick="ClickStep2" />
</asp:panel>
<asp:panel id="step3" runat="server">
Done!<br />
Name: <asp:label id="theFinalName" runat="server" /><br/>
Hobby: <asp:label id="theFinalHobby" runat="server" /><br/>
</asp:panel>
</form>
Important properties, methods and events of Panel control
DefaultButton: the default button in a Panel. The default button is invoked when you press the Enter button.
Direction: direction in which controls that display text are rendered.
Possible values are NotSet, LeftToRight, and RightToLeft.
GroupingText: render the Panel control as a fieldset with a particular legend.
HorizontalAlign: horizontal alignment of the contents of the Panel.
Possible values are Center, Justify, Left, NotSet, and Right.
ScrollBars: display scrollbars around the panel"s contents.
Possible values are Auto, Both, Horizontal, None, and Vertical.
<%@ 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>
Set AssociatedControlID for asp:Panel
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
Sub btnSubmit_Click(ByVal sender As Object, ByVal e As EventArgs)
If rdlOther.Checked Then
pnlOther.Visible = True
Else
pnlOther.Visible = False
End If
End Sub
</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"
OnClick="btnSubmit_Click"
Runat="server" />
</div>
</form>
</body>
</html>
The Panel control enables you to work with a group of ASP.NET controls: show or hide
<%@ 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>
The ScrollBars property enables you to display scrollbars around a panel
<%@ 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>
Use asp:panel to host asp.net controls
<html><body>
<form runat="server">
<asp:Panel id="Panel1" runat="server">
<tr>
<td width="100" valign="top">First and last name:
</td>
<td width="300" valign="top">
<asp:TextBox id="tbFName" runat="server" />
<asp:TextBox id="tbLName" runat="server" />
</td>
</tr>
<tr>
<td valign="top">Email:</td>
<td valign="top">
<asp:TextBox id="tbEmail" runat="server" />
</td>
</tr>
<tr>
<td valign="top">Address:</td>
<td valign="top">
<asp:TextBox id="tbAddress" runat="server" />
</td>
</tr>
<tr>
<td valign="top">City, State, ZIP:</td>
<td valign="top">
<asp:TextBox id="tbCity" runat="server" />,
<asp:TextBox id="tbState" runat="server" size=2 />
<asp:TextBox id="tbZIP" runat="server" size=5 />
</td>
</tr>
<tr>
<td valign="top">Phone:</td>
<td valign="top">
<asp:TextBox id="tbPhone" runat="server" size=11 />
</td>
</tr>
<tr>
<td colspan="2" valign="top" align="right">
<asp:Button id="btSubmit" runat="server" text="Add"/>
</td>
</tr>
</asp:Panel>
</form>
</body>
</html>