ASP.NET Web Pages HTML 表单
表单是 HTML 文档中放置输入控件（文本框、复选框、单选按钮、下拉列表）的部分
创建一个 HTML 输入表单
<!DOCTYPE html> <meta charset="utf-8" /> @{ 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=""> <p>Company Name:</p> <p><input type="text" name="CompanyName" value="" /></p> <p>Contact Name:</p> <p><input type="text" name="ContactName" value="" /></p> <p><input type="submit" value="Submit" class="submit" /></p> </form>}}
创建一个下拉显示图片的表单
假设在我们的图像文件夹中有 3 张图片，我们想根据用户的选择动态地显示图片
这个功能可以通过一段简单的 Razor 代码来实现
假设我们的网站的图片文件夹中有一个名为 "photo_1.jpg" 的图片，我们可以使用 HTML 的 <img> 元素来显示图片
<img src="images/photo_1.jpg" alt="Sample" />
下面的范例演示了如何显示用户从下列列表中选择的图像
@{
var imagePath="";
if (Request["Choice"] != null)
{imagePath="images/" + Request["Choice"];}
}
<!DOCTYPE html>
<meta charset="utf-8" />
<h1>Display Images</h1>
<form method="post" action="">
I want to see:
<select name="Choice">
<option value="photo_1.jpg">Photo 1</option>
<option value="photo_2.jpg">Photo 2</option>
<option value="photo_3.jpg">Photo 3</option>
</select>
<input type="submit" value="Submit" />
@if (imagePath != "")
{<p><img src="@imagePath" alt="Sample" /></p>}
</form>
在这个范例中，服务器创建了一个叫 imagePath 的变量
HTML 页面有一个名为 Choice 的 下拉列表 ( <select> 元素 )
它允许用户根据自己的意愿选择一个名称（如 photo_1 ），当页面被提交到 Web 服务器时，则传递了一个文件名 ( 如 photo_1.jpg )
Razor 代码通过 Request["Choice"] 读取 Choice 的值
如果通过代码构建的图片路径（images/photo_1.jpg）有效，就把图像路径赋值给变量 imagePath
在 HTML 页面中，<img> 元素用来显示图片
当页面显示时，src 属性用来设置 imagePath 变量的值
<img> 元素是在一个 if 语句中，这是为了防止显示没有名称的图像，比如页面第一次被加载显示的时候