Ngôn ngữ ASP.NET - Điều khiển CheckBoxList
Điều khiển CheckBoxList của Web Form
Dùng để tạo ra nhóm các CheckBox, cho phép người sử dụng chọn nhiều trong nhiều chọn lựa. Đây là điều khiển danh sách nên nó cũng có thuộc tính items chứa tập hợp các mục chọn
Để tạo CheckBoxList bạn có thể viết code hoặc kéo thả từ công cụ trực quan của Visual Studio.
Cú pháp tạo điều khiển CheckBoxList phía Server:
<asp:CheckBoxList ID="CheckBoxList1" runat="server">
<asp:ListItem>Lập Trình C</asp:ListItem>
<asp:ListItem>Lập Trình Web</asp:ListItem>
<asp:ListItem>Lập Trinh Di Động</asp:ListItem>
<asp:ListItem>Lập Trình Window</asp:ListItem>
</asp:CheckBoxList>
Phía server xử lý code trên trả về cho trình duyệt dạng HTML:
<table id="CheckBoxList1">
<tr>
<td><input id="CheckBoxList1_0" type="checkbox" name="CheckBoxList1$0" value="Lập Trình C" /><label for="CheckBoxList1_0">Lập Trình C</label></td>
</tr><tr>
<td><input id="CheckBoxList1_1" type="checkbox" name="CheckBoxList1$1" value="Lập Trình Web" /><label for="CheckBoxList1_1">Lập Trình Web</label></td>
</tr><tr>
<td><input id="CheckBoxList1_2" type="checkbox" name="CheckBoxList1$2" value="Lập Trinh Di Động" /><label for="CheckBoxList1_2">Lập Trinh Di Động</label></td>
</tr><tr>
<td><input id="CheckBoxList1_3" type="checkbox" name="CheckBoxList1$3" value="Lập Trình Window" /><label for="CheckBoxList1_3">Lập Trình Window</label></td>
</tr>
</table>
Bảng thuộc tính điều khiển CheckBoxList
Thuộc tính | Ý nghĩa |
(ID) | Qui định tên của điều khiển. Tên của điều khiển là duy nhất. |
AccessKey | Qui định ký tự để di chuyển nhanh đến điều khiển - ký tự xử lý phím nóng. |
BackColor | Qui định màu nền của điều khiển. |
CssClass | Qui định hình thức hiển thị của điều khiển qua tên CSS. |
Enabled | Qui định điều khiển có được hiển thị hay không. Giá trị mặc định của thuộc tính này là True – được phép hiển thị. |
Font | Qui định Font hiển thị cho điều khiển |
ForeColor | Qui định màu chữ hiển thị trên điều khiển |
Height | Qui định chiều cao của điều khiển |
ToolTip | Dòng chữ sẽ hiển thị khi rê chuột vào điều khiển. |
Width | Qui định độ rộng của điều khiển. |
AutoPostBack | Thuộc tính này qui định điều khiển có được phép tự động PostBack về Server khi chỉ số của mục chọn bị thay đổi. Giá trị mặc định của thuộc tính này là False - không tự động Postback. |
Items | Đây là tập hợp chứa các mục chọn của điều khiển. Ta có thể thêm vào mục chọn vào thời điểm thiết kế thông qua cửa sổ ListItem Collection Editor, hoặc thông qua lệnh. |
RepeatColumns | Số cột hiển thị. |
RepeatDirection | Hình thức hiển thị Vertical: chiều dọc Horizontal: chiều ngang |
Window thuộc tính CheckBoxList
Ví dụ: Tạo trang web CheckBoxList.aspx cho người sử dụng chọn các môn học sau:
Bước 1: Kéo CheckBoxList từ thanh toolbox vào trang web
Bước 2: Vào Window thuộc tính chọn Item thêm dữ liệu cho CheckBoxList
Bước 3: Click vào Collection sẽ mở một window mới như sau, Ban đầu không có dữ liệu, click vào nút add để thêm Text và Value cho CheckBoxList.
Sau đó click vào Ok
Code trang CheckBoxList.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CheckBoxList.aspx.cs" Inherits="CheckBoxList" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<table style="width: 51%;">
<tr>
<td>Bạn Thích môn học nào?</td>
</tr>
<tr>
<td>
<form id="form1" runat="server">
<div>
<asp:CheckBoxList ID="chkSubject" runat="server">
<asp:ListItem>Lập Trình C</asp:ListItem>
<asp:ListItem>Lập Trình Web</asp:ListItem>
<asp:ListItem>Lập Trinh Di Động</asp:ListItem>
<asp:ListItem>Lập Trình Window</asp:ListItem>
</asp:CheckBoxList>
</div>
</form>
</td>
</tr>
<tr>
<td>
<asp:Button ID="btnView" runat="server" Text="Xem các môn học đã chọn" Width="227px" />
</td>
</tr>
<tr>
<td>Danh sách các môn học thích:</td>
</tr>
<tr>
<td>
<asp:Label ID="lblChoose" runat="server" Text="Label"></asp:Label>
</td>
</tr>
</table>
<asp:CheckBoxList ID="CheckBoxList1" runat="server" Height="29px" Width="135px">
</asp:CheckBoxList>
</body>
</html>
Code behind trang CheckBoxList.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class CheckBoxList : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnView_Click(object sender, EventArgs e)
{
string subject;
subject = chkSubject.SelectedItem.Text;
lblChoose.Text = "Môn học yêu thích:";
for (int i = 0; i < chkSubject.Items.Count; i++)
if (chkSubject.Items[i].Selected)
lblChoose.Text += "<br/>" + chkSubject.Items[i].Text;
}
}
Thực thi trang web cho kết quả
Chọn các mục sau đó click vào button cho kết quả