ASP.NET Web Pages HTML 表單
asp.net web pages - html 表單
表單是 html 文檔中放置輸入控件（文本框、復(fù)選框、單選按鈕、下拉列表）的部分。
創(chuàng)建一個 html 輸入頁面
razor 實例
<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>
<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>
razor 實例 - 顯示圖像
假設(shè)在您的圖像文件夾中有 3 張圖像，您想根據(jù)用戶的選擇動態(tài)地顯示圖像。
這可以通過一段簡單的 razor 代碼來實現(xiàn)。
如果在您的網(wǎng)站的圖像文件夾中有一個名為 "photo1.jpg" 的圖像，您可以使用 html 的 <img> 元素來顯示圖像，如下所示：
<img src="images/photo1.jpg" alt="sample" />
下面的例子演示了如何顯示用戶從下列列表中選擇的圖像：
razor 實例
@{
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>
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>
實例解釋
服務(wù)器創(chuàng)建了一個叫 imagepath 的變量。
html 頁面有一個名為 choice 的下拉列表（<select> 元素）。它允許用戶根據(jù)自己的意愿選擇一個名稱（如 photo 1），當(dāng)頁面被提交到 web 服務(wù)器時，則傳遞了一個文件名（如 photo1.jpg）。
razor 代碼通過 request["choice"] 讀取 choice 的值。如果通過代碼構(gòu)建的圖像路徑（images/photo1.jpg）有效，就把圖像路徑賦值給變量 imagepath。
在 html 頁面中，<img> 元素用來顯示圖像。當(dāng)頁面顯示時，src 屬性用來設(shè)置 imagepath 變量的值。
<img> 元素是在一個 if 塊中，這是為了防止顯示沒有名稱的圖像，比如頁面第一次被加載顯示的時候。
ASP實戰(zhàn)