Home > Article > Backend Development > Share ASP.NET study notes (6) WebPages form
Share ASP.NET study notes (6) WebPages form
- 零下一度Original
- 2017-05-25 09:16:191398browse
A form is the part of an HTML document where input controls (text boxes, check boxes, radio buttons, drop-down lists) are placed.
Create an HTML input page
Razor Example
<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 Example - Display Image
Assume that in your There are 3 images in the images folder and you want to display the images dynamically based on the user's selection.
This can be achieved with a simple piece of Razor code.
If you have an image named "Photo1.jpg" in your website's images folder, you can use the HTML a1f02c36ba31691bcfe87b2722de723b element to display the image, like this:
<img src="images/Photo1.jpg" alt="Sample" />
The following example demonstrates how to display an image selected by the user from the following list:
Razor Example
@{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>Example Explanation
The server creates a file called Variable of imagePath.
The HTML page has a drop-down list (221f08282418e2996498697df914ce4e element) named Choice. It allows the user to choose a name of their own choosing (e.g. Photo 1), and when the page is submitted to the web server, a file name is passed (e.g. Photo1.jpg).
Razor code reads the value of Choice through Request["Choice"]. If the image path (images/Photo1.jpg) constructed through code is valid, assign the image path to the variable imagePath.
In HTML pages, the a1f02c36ba31691bcfe87b2722de723b element is used to display images. The src attribute is used to set the value of the imagePath variable when the page is displayed. The
a1f02c36ba31691bcfe87b2722de723b element is inside an if block. This is to prevent the image from being displayed without a name, such as when the page is first loaded.
【Related recommendations】
1. ASP.NET free video tutorial
2. Share ASP.NET study notes (1) --WebPages Razor
3. Share ASP.NET study notes (2)--WebPages Introduction
4. Share ASP.NET study Notes (3) WebPages layout
5. Share ASP.NET learning notes (4) Folder
6. Share ASP.NET learning Notes (5) Global page AppStart and PageStart
The above is the detailed content of Share ASP.NET study notes (6) WebPages form. For more information, please follow other related articles on the PHP Chinese website!