ASP.NET Tạo table hiện thị phức tạp bằng Repeater control

Trong thời gian gần đây tôi gặp nhiều bài toán cần hiển thị TABLE có giao diện phức tạp mà Gridview Control trong ASP.NET không thỏa mãn được. Tôi tìm hiểu và thấy rằng để hiện thị những giao diện phức  tạp của TABLE như hình sau chẳng hạn:

Sử dụng Repeater Control để render

Sử dụng Repeater Control để render

Để thể hiện như  ví dụ trên tôi viết đoạn code như  sau:

<table width=’100%’ cellspacing=’0′ cellpadding=’0′ border=’0′>
<tbody>
<tr>
<td height=’25px’ valign=’top’ class=’bgrxam’>
<asp:Repeater ID=”rpt1″ runat=’server’>
<HeaderTemplate>
<table cellspacing=”0″ cellpadding=”0″ border=”0″ width=”100%” style=”border-collapse: collapse;”>
<tbody>
<tr>
<td align=”center”>
<p align=”center” style=”margin-top: 3px; margin-bottom: 3px;”>
Giải thưởng</p>
</td>
<td align=”center”>
<p align=”center” style=”margin-top: 3px; margin-bottom: 3px;”>
Kết quả</p>
</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td height=”25″ width=”20%”>
<%#Eval(“GIAITHUONG”)%>
</td>
<td width=”80%”>
<%#Eval(“KETQUA”)%>
</td>
</tr>
<tr><td height=”2px” background=”images/default/line3d.jpg” colspan=”2″></td></tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr>
<td height=”25″ width=”20%”>
<%#Eval(“GIAITHUONG”)%>
</td>
<td width=”80%”>
<%#Eval(“KETQUA”)%>
</td>
</tr>
<tr><td height=”2px” background=”images/default/line3d.jpg” colspan=”2″></td></tr>
</AlternatingItemTemplate>
<FooterTemplate>
</tbody> </table>
</FooterTemplate>
</asp:Repeater>
</td>
<td height=’25px’ valign=’top’ class=’bgrxam’>
<asp:Repeater ID=”rpt2″ runat=’server’>
<HeaderTemplate>
</HeaderTemplate>
<ItemTemplate>
</ItemTemplate>
<FooterTemplate>
</FooterTemplate>
</asp:Repeater>
</td>
</tr>
</tbody>
</table>

Tóm lại với Repeater Control, chúng ta có thể render ra những table có độ phức tạp về thể hiện khác nhau 🙂

Advertisements

One thought on “ASP.NET Tạo table hiện thị phức tạp bằng Repeater control

  1. Chào anh, em thử copy đoạn code của anh về cho vào C# nhưng không chạy được, cho hỏi anh tý là để hiển thị giao diện như trên có cần phải tạo Forml ko anh, hay chỉ tạo code là chạy lên được giao diện như trên. em mới tập tọe môn này nên chưa hiểu lắm, rất mong nhân được hồi âm của anh. vinhtn184@gmail.com

    Phản hồi

Trả lời

Mời bạn điền thông tin vào ô dưới đây hoặc kích vào một biểu tượng để đăng nhập:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Đăng xuất /  Thay đổi )

Google+ photo

Bạn đang bình luận bằng tài khoản Google+ Đăng xuất /  Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Đăng xuất /  Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Đăng xuất /  Thay đổi )

w

Connecting to %s