Kontrol panel dapat berfungsi sebagai wadah untuk kontrol lain di halaman. Ini mengontrol tampilan dan visibilitas kontrol yang ada di dalamnya. Ini juga memungkinkan pemrograman kontrol yang dihasilkan.
Sintaks dasar kontrol panel adalah sebagai berikut:
<asp:Panel ID= "Panel1" runat = "server"></asp:Panel>
Kontrol panel berasal dari kelas WebControl. Oleh karena itu, ia mewarisi semua properti, metode, dan peristiwa secara merata. Ia tidak memiliki metode atau kejadiannya sendiri. Namun, ia memiliki sifat-sifatnya sendiri sebagai berikut:
milik | menggambarkan |
---|---|
KembaliImageUrl | Alamat gambar latar belakang panel. |
Tombol Default | Mendapatkan atau menyetel pengidentifikasi tombol default yang terdapat dalam kontrol Panel. |
Arah | Arah teks di panel. |
PengelompokanTeks | Izinkan teks dikelompokkan sebagai bidang. |
Sejajarkan Horizontal | Sejajarkan konten di panel secara horizontal. |
ScrollBar | Menentukan visibilitas dan posisi bilah gulir di dalam panel. |
Membungkus | Izinkan teks untuk dibungkus. |
Mari kita mulai dengan panel gulir dengan tinggi dan lebar tertentu, serta gaya tepi sederhana. Properti scrollbar diatur ke dua scrollbar, sehingga kedua scrollbar dirender secara bersamaan.
File sumber memiliki kode label panel berikut:
<asp:Panel ID="Panel1" runat="server" BorderColor="#990000" BorderStyle="Solid" Borderstyle="width:1px" Height="116px" ScrollBars="Both"> This is a scrollable panel. <br /> <br /> <asp:Button ID="btnpanel" runat="server" Text="Button" /></asp:Panel>
Panelnya muncul sebagai berikut:
Contoh berikut menunjukkan pembuatan konten dinamis. Pengguna menyediakan jumlah kontrol label dan kotak teks yang akan dibuat pada panel. Kontrol dihasilkan secara terprogram.
Gunakan jendela Properties untuk mengubah properti panel. Saat Anda memilih kontrol dalam tampilan Desain, jendela Properti menampilkan properti kontrol tertentu dan memungkinkan Anda mengubahnya tanpa mengetik.
File sumber contohnya adalah sebagai berikut:
<form id="form1" runat="server"> <div> <asp:Panel ID="pnldynamic" runat="server" BorderColor="#990000" BorderStyle="Solid" Borderstyle="width:1px" Height="150px" ScrollBars="Auto" BackColor="#CCCCFF" Font-Names="Courier" HorizontalAlign="Center"> This panel shows dynamic control generation: <br /> <br /> </asp:Panel> </div> <table> <tr> <td>No of Labels:</td> <td> <asp:DropDownList ID="ddllabels" runat="server"> <asp:ListItem>0</asp:ListItem> <asp:ListItem>1</asp:ListItem> <asp:ListItem>2</asp:ListItem> <asp:ListItem>3</asp:ListItem> <asp:ListItem>4</asp:ListItem> </asp:DropDownList> </td> </tr> <tr> <td> </td> <td> </td> </tr> <tr> <td>No of Text Boxes :</td> <td> <asp:DropDownList ID="ddltextbox" runat="server"> <asp:ListItem>0</asp:ListItem> <asp:ListItem Value="1"></asp:ListItem> <asp:ListItem>2</asp:ListItem> <asp:ListItem>3</asp:ListItem> <asp:ListItem Value="4"></asp:ListItem> </asp:DropDownList> </td> </tr> <tr> <td> </td> <td> </td> </tr> <tr> <td> <asp:CheckBox ID="chkvisible" runat="server" Text="Make the Panel Visible" /> </td> <td> <asp:Button ID="btnrefresh" runat="server" Text="Refresh Panel" /> </td> </tr> </table></form>
Kode sumber kontrol yang dihasilkan secara dinamis di balik peristiwa Page_Load adalah:
public partial class _Default : System.Web.UI.Page{ protected void Page_Load(object sender, EventArgs e) { //make the panel visible pnldynamic.Visible = chkvisible.Checked; //generating the lable controls: int n = Int32.Parse(ddllabels.SelectedItem.Value); for (int i = 1; i <= n; i++) { Label lbl = new Label(); lbl.Text = "Label" + (i).ToString(); pnldynamic.Controls.Add(lbl); pnldynamic.Controls.Add(new LiteralControl("<br />")); } //generating the text box controls: int m = Int32.Parse(ddltextbox.SelectedItem.Value); for (int i = 1; i <= m; i++) { TextBox txt = new TextBox(); txt.Text = "Text Box" + (i).ToString(); pnldynamic.Controls.Add(txt); pnldynamic.Controls.Add(new LiteralControl("<br />")); } }}
Saat dijalankan, panel ditampilkan sebagai: