Ngôn ngữ ASP.NET - Điều khiển Repeater

Điều khiển Repeater

Như 2 điều khiển DataList & DataGrid, điều khiển Repeater cũng được dùng để hiển thị dữ liệu. Tuy nhiên, để hiển thị dữ liệu, chúng ta phải tự thiết kế hình thức hiển thị thông qua các tag HTML.
Điều khiển Repeater có các tag sau:

  •  <HeaderTemplate></HeaderTemplate> (tùy chọn): Qui định hình thức hiển thị cho tiêu đề. (Chỉ xuất hiện 1 lần, phía trên của điều khiển)
  • <ItemTemplate></ItemTemplate> (Bắt buộc phải có): Qui định hình thức hiển thị cho các mục dữ liệu trong điều khiển.
  •  <AlternatingItemTemplate></AlternatingItemTemplate> (tùy chọn):  Qui định hình thức hiển thị giữa các dòng dữ liệu
  • <SeparatorTemplate></SeparatorTemplate> (tùy chọn)Qui định hình thức hiển thị cho các mục dữ liệu trong điều khiển. Nội dung được qui định trong cặp tag này sẽ hiển thị xen kẽ với các nội dung trong cặp tag <ItemTemplate> </ItemTemplate>
  • <FooterTemplate></FooterTemplate> (tùy chọn): Qui định hình thức hiển thị cho tiêu đề dưới. (Chỉ xuất hiện 1 lần, phía dưới của điều khiển).

Điểu khiển Repeater hỗ trợ các sự kiện sau:

  • DataBinding: xảy ra khi Repeater được rạng buộc đến dữ liệu
  • ItemCommand: xảy ra khi bên trong Repeater chứa đựng điều khiện Command và điều khiển này đưa ra sự kiện.
  • ItemCreate: xảy ra khi mỗi RepeaterItem được tạo
  • ItemDataBound: xảy ra khi mỗi item của Repeater được ràng buộc

Ví dụ:
Bước 1:  Tạo mới điều khiển Repeater: rptChudesach vào trang Web.

Bước 2: Kết nối và tạo nguồn dữ liệu cho điều khiển từ Table Chude với các cột: MaCD, Tenchude.
Bước 3: Chuyển qua xem trang Web dưới dạng HTML

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Repeater.aspx.cs" Inherits="Repeater" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
        <asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
                    <HeaderTemplate>
            <table border="1"  cellspacing="0">
            <tr>
            <td width="60" align="center">
            <strong>Mã CĐ</strong>
            </td>
            <td width="150" align="center">
            <strong>Tên chủ đề </strong>
            </td>
            </tr>
            </HeaderTemplate>
            <ItemTemplate>
            <tr>
            <td>
            <%#  Eval("MaCd")     %>
            </td>
            <td>
            <%# Eval("Tenchude")%>
            </td>
            </tr>
            </ItemTemplate>
            <AlternatingItemTemplate>
            <tr bgcolor="GhostWhite">
            <td>
            <%# Eval("MaCD")%>
            </td>
            <td>
            <%# Eval("TenChude")%>
            </td>
            </tr>
            </AlternatingItemTemplate>
            <FooterTemplate>
            </table>
            </FooterTemplate>

        </asp:Repeater>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:QLBANSACH1ConnectionString %>" SelectCommand="SELECT * FROM [CHUDE]"></asp:SqlDataSource>
    
    </div>
    </form>
</body>
</html>

Bước 4:  Xem lại màn hình thiết kế và thực thi kết quả.

Tóm lại : Repeater dùng để hiển thị dữ liệu lấy ra theo layout do chúng ta tự định nghĩa (khác với GridView là chỉ hiển thị ở dạng bảng)