ASP.NET Web Pages - HTML 窗体

窗体(表单)是您在 HTML 文档中放置输入控件(文本框、复选框、单选框和下拉菜单)的位置。

创建 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>

ਚਲਾਉਣ ਵਾਲਾ ਇੰਸਟੈਂਸ

Razor 实例 - 显示图像

假设在您的图片文件夹中有三张图片,并且您希望根据用户的选择来动态地显示这些图片。

通过一小 Razor 就可以很容易地实现。

如果网站图片文件夹中的图片的名称是 "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>ਚਿੱਤਰਾਂ ਦਿਸਾਓ</h1> 
<form method="post" action=""> 
ਮੈਂ ਇਹ ਦੇਖਣਾ ਚਾਹੁੰਦਾ ਹਾਂ: 
<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>

ਚਲਾਉਣ ਵਾਲਾ ਇੰਸਟੈਂਸ

ਪ੍ਰਕਾਸ਼ਨ ਦਾ ਉਦਾਹਰਣ

ਸਰਵਰ ਨਾਮ ਵਾਲੀ imagePath ਹੈ

HTML ਪੰਨੇ ਵਿੱਚ ਨਾਮ ਵਾਲੀ ਵੈਰੀਅਬਲ Choice ਦਾਨਿਊਨਤਮ ਸੂਚੀ(<select> ਐਲੀਮੈਂਟ)。ਇਹ ਯੂਜ਼ਰ ਨੂੰ ਇੱਕ ਸਹੀਮਾਨ (ਮੈਗਰ: ਸੁਲੈਹਾਂ ਪੜ੍ਹਣ ਯੋਗ ਨਾਮ) ਚੁਣਨ ਦੀ ਇਜਾਜ਼ਤ ਦਿੰਦਾ ਹੈ (ਉਦਾਹਰਣ ਵਜੋਂ Photo 1),ਜਦੋਂ ਪੰਨਾ web ਸਰਵਰ ਨੂੰ ਸੰਪਾਦਿਤ ਕੀਤਾ ਜਾਂਦਾ ਹੈ ਤਾਂ ਸਰਵਰ ਨੂੰ ਫਾਇਲ ਨਾਮ (ਉਦਾਹਰਣ ਵਜੋਂ Photo1.jpg) ਪਸੰਦ ਕੀਤਾ ਜਾਂਦਾ ਹੈ。

Razor ਰਾਹੀਂ Request["Choice"] Choice ਦੀ ਕੀਮਤ ਪੜ੍ਹੋ।ਜੇਕਰ ਕੀਮਤ ਮੌਜੂਦ ਹੈ ਤਾਂ ਕੋਡ ਚਿੱਤਰ ਦੀ ਸਥਿਤੀ (images/Photo1.jpg) ਦਾ ਪਾਥ ਤਿਆਰ ਕਰਦਾ ਹੈ ਅਤੇ ਪਾਥ ਵੈਰੀਅਬਲ ਵਿੱਚ ਸਟੋਰ ਕਰਦਾ ਹੈ imagePath ਵਿੱਚ。

HTML ਪੰਨੇ ਵਿੱਚ <img> ਐਲੀਮੈਂਟ ਇਹ ਚਿੱਤਰ ਦਿਸਾਉਂਦਾ ਹੈ।ਜਦੋਂ ਪੰਨਾ ਦਿਸਾਇਆ ਜਾਂਦਾ ਹੈ ਤਾਂ src ਪ੍ਰਤੀਭਾਸ਼ਾ ਵੈਰੀਅਬਲ imagePath ਦਾ ਮੁੱਲ ਸੈੱਟ ਕੀਤੀ ਜਾਂਦੀ ਹੈ。

ਜੇਕਰ ਵੈਰੀਅਬਲ imagePath ਦਾ ਮੁੱਲ ਖਾਲੀ ਹੈ ਤਾਂ <img> ਐਲੀਮੈਂਟ ਦਿਸ਼ਾ ਦੀ ਮੌਜੂਦਗੀ ਨਾ ਹੋਣ ਵਾਲੀ ਚਿੱਤਰ ਦਿਸਾਉਣ ਤੋਂ ਰੋਕਦਾ ਹੈ (ਉਦਾਹਰਣ ਵਜੋਂ ਜਦੋਂ ਪੰਨਾ ਪਹਿਲੀ ਵਾਰ ਲੋਡ ਹੁੰਦਾ ਹੈ)。