ASP.NET Web Pages - Công cụ WebGrid

WebGrid - Một trong những công cụ hữu ích của ASP.NET Web.

Viết HTML thủ công

Trong các chương trước, chúng ta đã sử dụng mã razor để hiển thị dữ liệu từ cơ sở dữ liệu và viết tất cả các thẻ HTML một cách thủ công:

Mô hình Database

@{
var db = Database.Open("SmallBakery"); 
var selectQueryString = "SELECT * FROM Product ORDER BY Name"; 
}
<html> 
<body> 
<h1>Sản phẩm nhà bánh nhỏ</h1> 
<table> 
<tr>
<th>Id</th> 
<th>Sản phẩm</th> 
<th>Mô tả</th> 
<th>Giá</th> 
</tr>
@foreach(var row in db.Query(selectQueryString))
{
<tr> 
<td>@row.Id</td> 
<td>@row.Name</td> 
<td>@row.Description</td> 
<td align="right">@row.Price</td> 
</tr> 
}
</table> 
</body> 
</html>

Chạy mẫu

Sử dụng trợ lý WebGrid

Sử dụng trợ lý WebGrid là phương pháp đơn giản hơn để hiển thị dữ liệu.

Trợ lý WebGrid:

  • Tự động tạo bảng HTML để hiển thị dữ liệu
  • Hỗ trợ các tùy chọn định dạng khác nhau
  • Hỗ trợ phân trang dữ liệu
  • Hỗ trợ sắp xếp theo tiêu đề cột khi nhấp

Mẫu WebGrid

@{ 
var db = Database.Open("SmallBakery") ; 
var selectQueryString = "SELECT * FROM Product ORDER BY Id"; 
var data = db.Query(selectQueryString); 
var grid = new WebGrid(data); 
}
<html> 
<head> 
<title>Hiển thị dữ liệu sử dụng WebGrid Helper</title> 
</head> 
<body> 
<h1>Sản phẩm nhà bánh nhỏ</h1> 
<div id="grid"> 
@grid.GetHtml()
</div> 
</body> 
</html>

Chạy mẫu