Panel Control
- The Panel control is used as a container for other controls.
- This control is often used to generate controls by code and to display and hide groups of controls.
- This control renders as an HTML <div> element.
Property |
Description |
BackImageUrl |
Specifies a URL to an image file to display as a background for this control |
HorizontalAlign |
Specifies the horizontal alignment of the content. Legal values are:
- Center
- Justify
- Left
- NotSet
- Right
|
id |
A unique id for the control |
runat |
Specifies that the control is a server control. Must be set to "server" |
Wrap |
A Boolean value that specifies whether the content should wrap or not |
1 |
<script runat="server"> |
2 |
Sub Page_Load(sender As Object, e As EventArgs) |
3 |
if check1.Checked then |
4 |
panel1.Visible=false |
5 |
else |
6 |
panel1.Visible=true |
7 |
end if |
8 |
End Sub |
9 |
</script> |
10 |
<html> |
11 |
<body> |
12 |
<form runat="server"> |
13 |
<asp:Panel id="panel1" runat="server" BackColor="#ff0000" Height="100px" Width="100px"> |
14 |
Hello World! |
15 |
</asp:Panel> |
16 |
<asp:CheckBox id="check1" Text="Hide Panel control" runat="server"/> |
17 |
<br /><br /> |
18 |
<asp:Button Text="Reload" runat="server" /> |
19 |
</form> |
20 |
</body> |
21 |
</html> |
- Open Visual Studio
- Add a new webform
- Name it Panel.aspx
- Click the Add button
- Select the Design View
- Add a checkbox control and name it chkDisplay
- Add a panel control and name it pnlDisplay
- You can make it larger by dragging the corners out
- Add 2 label, 2 textboxes and a button control into the panel control
- Change the text properties of the labels to Username and Password.
- Change the text of the button control to Submit
- Select the checkbox and set the autoPostback property to true
- Change the text to Display Login
- Double-click the form and add this code:
If chkDisplay.Checked Then
pnlDisplay.Visible = True
Else
pnlDisplay.Visible = False
End If
