ASP.NET Web Pages - Thẻ HTML
- Trang trước Toàn cục WebPages
- Trang tiếp theo Đối tượng WebPages
Thẻ (form) là nơi bạn đặt các điều khiển nhập (hộp văn bản, ô kiểm tra, ô chọn và danh sách rút gọn) trong tài liệu HTML của bạn.
Tạo trang HTML nhập liệu
MauGiaRazor
<html>
<body>
@{
if (IsPost) {
string tencongty = YeuCau["tencongty"];
string tenlienhe = YeuCau["tenlienhe"];
<p>Bạn đã nhập: <br />
Tên Công Ty: @tencongty <br />
Tên Liên Hệ: @tenlienhe </p>
}
else
{
<form method="post" action="">
Tên Công Ty:<br />
<input type="text" name="TenCongTy" value="" /><br />
Tên Liên Hệ:<br />
<input type="text" name="TenLienHe" value="" /><br /><br />
<input type="submit" value="Gửi" class="gui" />
</form>
}
}
</body>
</html>
Chạy mẫu
MauGiaRazor - Hiển thị hình ảnh
Giả sử bạn có ba hình ảnh trong thư mục hình ảnh và bạn muốn hiển thị các hình ảnh này động dựa trên lựa chọn của người dùng.
Bạn có thể dễ dàng thực hiện điều này bằng một đoạn Razor ngắn.
Nếu tên hình ảnh trong thư mục hình ảnh của trang web là "Photo1.jpg", bạn có thể sử dụng thẻ HTML <img> để hiển thị hình ảnh này như sau:
<img src="images/Photo1.jpg" alt="Mẫu" />
Dưới đây là ví dụ về cách hiển thị hình ảnh mà người dùng chọn từ danh sách rút gọn:
MauGiaRazor
@{
var duongDanHinhAnh="";
if (YeuCau["Chon"] != null)
{duongDanHinhAnh="images/" + YeuCau["Chon"];}
}
<!DOCTYPE html>
<html>
<body>
<h1>Hiển thị Hình ảnh</h1>
<form method="post" action="">
Tôi muốn xem:
<select name="Choice">
<option value="Photo1.jpg">Photo 1</option>
<option value="Photo2.jpg">Photo 2</option>
<option value="Photo3.jpg">Photo 3</option>
</select>
<input type="submit" value="Submit" />
@if (imagePath != "")
{
<p>
<img src="@imagePath" alt="Sample" />
</p>
}
</form>
</body>
</html>
Chạy mẫu
Giải thích ví dụ
Máy chủ tạo ra biến tên imagePath 。
Trang HTML có biến tên Choice củaDanh sách rơi（thuộc tính <select>）。Nó cho phép người dùng chọn một tên dễ đọc (ví dụ Photo 1），khi trang được gửi lên máy chủ web, gửi tên tệp (ví dụ Photo1.jpg) đến máy chủ.
Razor thông qua Request["Choice"] Đọc giá trị của Choice. Nếu giá trị tồn tại, mã sẽ tạo ra đường dẫn đến hình ảnh (images/Photo1.jpg) và lưu trữ đường dẫn trong biến imagePath 。
Phần tử <img> trong trang HTML hiển thị hình ảnh này. Khi hiển thị trang, thuộc tính src sẽ được thiết lập thành giá trị của biến imagePath.
Nếu giá trị của biến imagePath là rỗng, nó sẽ ngăn chặn phần tử <img> hiển thị hình ảnh không tồn tại (ví dụ khi trang được tải lần đầu tiên).
- Trang trước Toàn cục WebPages
- Trang tiếp theo Đối tượng WebPages
