.NET开发：＊Using the ASP.NET Panel Control...

热点排行

＊Using the ASP.NET Panel Control...

类别：.NET开发点击：0 评论：0 推荐：

By: John Kilgo

Date: March 6, 2003

Download the code.

Printer Friendly Version

The Panel Control is so easy to use that I hesitated to even write an article about it. But I have received several questions about it so decided to write the article anyway. The Panel Control is a container that allows you to include other server controls on it. It is primarily used for containing labels, textboxes, checkboxes and other controls that you would normally use on a web form. Panels come in handy especially when you have very large forms that become unweildy to deal with. Using panels you can reveal your form one logical section at a time and make it appear less cumbersome. The control has only a few properties, visible being the most useful.

In this example we will use three panels to display our form, along with three button controls to control the visibility of each panel. Our form actually is not very large, but it should serve the purpose of showing what can be done with the panel.

As can be seen in the following .aspx file each section contains a panel opening tag with some properties being set, followed by the server controls to be contained on the panel, followed by the panel's closing tag. All other processing takes place in a code-behind file to be shown further below. At the top of the aspx file are several buttons which will be used to show the various panels. Notice that the three buttons that control the panels raise and OnCommand event which will be handled in the code-behind file. I also place a Submit button on the form although I wrote no code for it.

<%@ Page Language="vb" Src="PanelControl.aspx.vb" Inherits="PanelControl" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>PanelControl</title>
<meta content="Microsoft Visual Studio.NET 7.0" name=GENERATOR>
<meta content="Visual Basic 7.0" name=CODE_LANGUAGE>
<meta content=JavaScript name=vs_defaultClientScript>
<meta content=http://schemas.microsoft.com/intellisense/ie5 name=vs_targetSchema>
</head>
<body MS_POSITIONING="GridLayout">
<form id=Form1 method=post runat="server">
<asp:Button ID="btnName" CommandName="name" OnCommand="button_click" text="Name" Runat="server" />
<asp:Button ID="btnAddress" CommandName="address" OnCommand="button_click" Text="Address" Runat="server" />
<asp:Button ID="btnPhone" CommandName="phone" OnCommand="button_click" Text="Telephone" Runat="server" />
<asp:Button ID="btnSubmit" Text="Submit" Runat="server" />
<asp:Panel id="pnlName"
        style="Z-INDEX: 101; LEFT: 20px; POSITION: absolute; TOP: 64px"
        runat="server"
        Height="182px"
        Width="278px">
  <TABLE>
    <TR>
      <TD><asp:Label id="lblFirstName" Runat="server" text="First Name:"></asp:Label></TD>
      <TD><asp:TextBox id="txtFirstName" Runat="server"></asp:TextBox></TD></TR>
    <TR>
      <TD><asp:Label id="lblMiddleName" Runat="server" text="Middle Name:"></asp:Label></TD>
      <TD><asp:TextBox id="txtMiddleName" Runat="server"></asp:TextBox></TD>
    </TR>
    <TR>
      <TD><asp:Label id="lblLastName" Runat="server" text="Last Name:"></asp:Label></TD>
      <TD><asp:TextBox id="txtLastName" Runat="server"></asp:TextBox></TD>
    </TR>
  </TABLE>
</asp:Panel>
<asp:Panel id="pnlPhone"
        style="Z-INDEX: 102; LEFT: 20px; POSITION: absolute; TOP: 64px"
        runat="server"
        Height="182px"
        Width="278px">
  <TABLE>
    <TR>
      <TD><asp:Label id="lblPhone" Runat="server" text="Telephone:"></asp:Label></TD>
      <TD><asp:TextBox id="txtPhone" Runat="server"></asp:TextBox></TD>
    </TR>
    <TR>
      <TD><asp:Label id="lblCellPhone" Runat="server" text="Cell Phone:"></asp:Label></TD>
      <TD><asp:TextBox id="txtCellPhone" Runat="server"></asp:TextBox></TD>
    </TR>
    <TR>
      <TD><asp:Label id="lblFax" Runat="server" text="FAX:"></asp:Label></TD>
      <TD><asp:TextBox id="txtFax" Runat="server"></asp:TextBox></TD>
    </TR>
  </TABLE>
</asp:Panel>
<asp:Panel id="pnlAddress"
        style="Z-INDEX: 103; LEFT: 20px; POSITION: absolute; TOP: 64px"
        runat="server"
        Height="182px"
        Width="278px">>
  <TABLE>
    <TR>
      <TD><asp:Label id="lblAddr1" Runat="server" text="Address1:"></asp:Label></TD>
      <TD><asp:TextBox id="txtAddr1" Runat="server"></asp:TextBox></TD>
    </TR>
    <TR>
      <TD><asp:Label id="lblAddr2" Runat="server" text="Address2:"></asp:Label></TD>
      <TD><asp:TextBox id="txtAddr2" Runat="server"></asp:TextBox></TD>
    </TR>
    <TR>
      <TD><asp:Label id="lblCity" Runat="server" text="Cityh:"></asp:Label></TD>
      <TD><asp:TextBox id="txtCity" Runat="server"></asp:TextBox></TD>
    </TR>
    <TR>
      <TD><asp:Label id="lblState" Runat="server" text="State:"></asp:Label></TD>
      <TD><asp:TextBox id="txtState" Runat="server"></asp:TextBox></TD>
    </TR>
    <TR>
      <TD><asp:Label id="lblZipCode" Runat="server" text="Zip Code:"></asp:Label></TD>
      <TD><asp:TextBox id="txtZipCode" Runat="server"></asp:TextBox></TD>
    </TR>
  </TABLE>
</asp:Panel>
</FORM>
</body>
</html>

It is in the code-behind file, shown below that we control the visibility of the three panels we defined in the aspx file. Depending on which button was clicked we set its corresponding panel's visibility to "True" and the other panels' visibility to false.

Public Class PanelControl : Inherits System.Web.UI.Page
  Protected WithEvents pnlName As System.Web.UI.WebControls.Panel
  Protected WithEvents pnlAddress As System.Web.UI.WebControls.Panel
  Protected WithEvents lblFirstName As System.Web.UI.WebControls.Label
  Protected WithEvents txtFirstName As System.Web.UI.WebControls.TextBox
  Protected WithEvents lblMiddleName As System.Web.UI.WebControls.Label
  Protected WithEvents txtMiddleName As System.Web.UI.WebControls.TextBox
  Protected WithEvents lblLastName As System.Web.UI.WebControls.Label
  Protected WithEvents txtLastName As System.Web.UI.WebControls.TextBox
  Protected WithEvents lblAddr1 As System.Web.UI.WebControls.Label
  Protected WithEvents txtAddr1 As System.Web.UI.WebControls.TextBox
  Protected WithEvents lblAddr2 As System.Web.UI.WebControls.Label
  Protected WithEvents txtAddr2 As System.Web.UI.WebControls.TextBox
  Protected WithEvents lblCity As System.Web.UI.WebControls.Label
  Protected WithEvents txtCity As System.Web.UI.WebControls.TextBox
  Protected WithEvents lblState As System.Web.UI.WebControls.Label
  Protected WithEvents txtState As System.Web.UI.WebControls.TextBox
  Protected WithEvents lblZipCode As System.Web.UI.WebControls.Label
  Protected WithEvents txtZipCode As System.Web.UI.WebControls.TextBox
  Protected WithEvents lblPhone As System.Web.UI.WebControls.Label
  Protected WithEvents txtPhone As System.Web.UI.WebControls.TextBox
  Protected WithEvents lblCellPhone As System.Web.UI.WebControls.Label
  Protected WithEvents txtCellPhone As System.Web.UI.WebControls.TextBox
  Protected WithEvents lblFax As System.Web.UI.WebControls.Label
  Protected WithEvents txtFax As System.Web.UI.WebControls.TextBox
  Protected WithEvents pnlPhone As System.Web.UI.WebControls.Panel

  Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
    pnlName.Visible = True
    pnlPhone.Visible = False
    pnlAddress.Visible = False
  End Sub

  Public Sub Button_Click (sender As System.Object, e As system.Web.UI.WebControls.CommandEventArgs)
    If e.CommandName="address" Then
      pnlName.Visible = False
      pnlPhone.Visible = False
      pnlAddress.Visible = True
    ElseIf e.CommandName = "name" Then
      pnlPhone.Visible = False
      pnlAddress.Visible = False
      pnlName.Visible = True
    ElseIF e.CommandName = "phone" Then
      pnlAddress.Visible = False
      pnlName.Visible = False
      pnlPhone.Visible = True
    End If
  End Sub
End Class

In conclusion I hope you can see how easy it is to utilize panel controls and how they can bring some order and organization to your very large web forms.

You may run the example program here.
You may download the code here.

本文地址：http://com.8s8s.com/it/it43754.htm