ส่วนนี้จะอธิบายให้คุณทราบถึงแบบฟอร์ม ASP.NET WebPages HTML
แบบฟอร์มคือส่วนของเอกสาร HTML ที่มีการวางตัวควบคุมอินพุต (กล่องข้อความ กล่องกาเครื่องหมาย ปุ่มตัวเลือก รายการแบบหล่นลง)
ตัวอย่างมีดโกน
<html> <body> @{if (IsPost) { string companyname = Request["companyname"]; string contactname = Request["contactname"]; <p>คุณป้อน: <br /> ชื่อบริษัท: @companyname <br /> ชื่อผู้ติดต่อ: @contactname </p>}อื่น ๆ{ <form method="post" action=""> ชื่อบริษัท:<br /> <input type="text" name="CompanyName" value="" /><br /> ชื่อผู้ติดต่อ:<br /> <input type="text" name="ContactName" value="" /><br /><br /> <input type="submit" value="Submit" /> </form> } - </ร่างกาย> </html>
สมมติว่าคุณมีรูปภาพ 3 รูปในโฟลเดอร์รูปภาพ และคุณต้องการแสดงรูปภาพแบบไดนามิกตามการเลือกของผู้ใช้
ซึ่งสามารถทำได้โดยใช้รหัส Razor ง่ายๆ
หากคุณมีรูปภาพชื่อ "Photo1.jpg" ในโฟลเดอร์รูปภาพของเว็บไซต์ของคุณ คุณสามารถใช้องค์ประกอบ HTML <img> เพื่อแสดงรูปภาพดังที่แสดงด้านล่าง:
<img src="images/Photo1.jpg" />
ตัวอย่างต่อไปนี้สาธิตวิธีการแสดงภาพที่ผู้ใช้เลือกจากรายการต่อไปนี้:
@{var imagePath=""; if (คำขอ["ตัวเลือก"] != null){imagePath="images/" + คำขอ["ตัวเลือก"];} } <!DOCTYPE html> <html> <body> <h1>แสดงรูปภาพ</h1> <form method="post" action=""> ฉันต้องการดู: <select name="Choice"> <option value=" Photo1.jpg">รูปภาพ 1</option> <option value="Photo2.jpg">รูปภาพ 2</option> <option value="Photo3.jpg">รูปภาพ 3</option> </select> <input type="ส่ง" value="ส่ง" /> @if (imagePath != ""){ <p> <img src="@imagePath " /> </p>} </รูปแบบ> </ร่างกาย> </html>เซิร์ฟเวอร์สร้างตัวแปรที่เรียกว่า imagePath
หน้า HTML มี รายการแบบเลื่อนลง (<select> องค์ประกอบ) ชื่อ Choice อนุญาตให้ผู้ใช้เลือกชื่อตามความต้องการของตนเอง (เช่น รูปภาพ 1 ) และเมื่อเพจถูกส่งไปยังเว็บเซิร์ฟเวอร์ ชื่อไฟล์ (เช่น Photo1.jpg ) จะถูกส่งไป
รหัส Razor อ่านค่าของ Choice ผ่าน Request["Choice"] หากเส้นทางรูปภาพ (images/Photo1.jpg) ที่สร้างผ่านโค้ดถูกต้อง ให้กำหนดเส้นทางรูปภาพให้กับตัวแปร imagePath
ในหน้า HTML องค์ประกอบ <img> ใช้เพื่อแสดงภาพ เมื่อเพจปรากฏขึ้น แอ็ตทริบิวต์ src จะถูกใช้เพื่อตั้งค่าของตัวแปร imagePath
องค์ประกอบ <img> อยู่ภายในบล็อก if เพื่อป้องกันไม่ให้รูปภาพแสดงโดยไม่มีชื่อ เช่น เมื่อโหลดเพจครั้งแรก