ASP.NET Web Pages - HTML Forms
Biểu mẫu là một phần của tài liệu HTML nơi bạn đặt các điều khiển đầu vào (hộp văn bản, hộp kiểm, nút radio và danh sách kéo xuống).
Tạo trang nhập HTML
Ví dụ về dao cạo
<html>
<body>
@{
if (IsPost) {
string companyname = Request["CompanyName"];
string contactname = Request["ContactName"];
<p>You entered: <br />
Company Name: @companyname <br />
Contact Name: @contactname </p>
}
else
{
<form method="post" action="">
Company Name:<br />
<input type="text" name="CompanyName" value="" /><br />
Contact Name:<br />
<input type="text" name="ContactName" value="" /><br /><br />
<input type="submit" value="Submit" class="submit" />
</form>
}
}
</body>
</html>
Ví dụ về dao cạo - Hiển thị hình ảnh
Giả sử bạn có 3 hình ảnh trong thư mục hình ảnh của mình và bạn muốn hiển thị hình ảnh động theo lựa chọn của người dùng.
Điều này có thể dễ dàng thực hiện bằng một mã Razor nhỏ.
Nếu bạn có một hình ảnh có tên "Photo1.jpg" trong thư mục hình ảnh trên trang web của mình, bạn có thể hiển thị hình ảnh bằng phần tử HTML <img> như sau:
<img src="images/Photo1.jpg" alt="Sample" />
Ví dụ dưới đây cho thấy cách hiển thị ảnh đã chọn mà người dùng chọn từ danh sách thả xuống:
Ví dụ về dao cạo
@{
var imagePath="";
if (Request["Choice"] != null)
{imagePath="images/" + Request["Choice"];}
}
<!DOCTYPE html>
<html>
<body>
<h1>Display Images</h1>
<form method="post" action="">
I want to see:
<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>
Giải thích ví dụ
Máy chủ tạo một biến được gọi là imagePath .
Trang HTML có một danh sách thả xuống (một phần tử <select>) có tên là Lựa chọn . Nó cho phép người dùng chọn một tên thân thiện (như Ảnh 1 ) và chuyển tên tệp (như Photo1.jpg ) khi trang được gửi đến máy chủ web.
Mã Razor đọc giá trị của Lựa chọn theo Yêu cầu ["Lựa chọn"] . Nếu nó có một giá trị, mã sẽ xây dựng một đường dẫn đến hình ảnh images / Photo1.jpg và lưu trữ nó trong biến imagePath .
Trong trang HTML có phần tử <img> để hiển thị hình ảnh. Thuộc tính src được đặt thành giá trị của biến imagePath khi trang hiển thị.
Phần tử <img> nằm trong khối if để ngăn việc cố gắng hiển thị hình ảnh không có tên (như lần đầu tiên trang được hiển thị).