ดาวน์โหลดงานนำเสนอ
งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ
1
การส่งค่าและการเก็บค่า (ต่อ... )
ASP [# 5] การส่งค่าและการเก็บค่า (ต่อ... )
2
การใช้ Objects ของ Form เพื่อส่งค่าต่าง ๆ
การใช้งาน Object อื่น ๆ ของ Form Form Button submit Button reset Text Filed Textarea Filed Check Box Radio Button List Menu Hidden Filed
3
1. Form กำหนดกรอบของ Form ที่จะมีการส่งข้อมูล การแทรก Element ของ Form อื่น ๆ ที่ต้องการส่งข้อมูลต้องกำหนดในช่วงกรอบนี้ รูปแบบ <form name="[form-name]" method="[post/get]" action="[file-name]"> </form> ตัวอย่าง <form name="form1" method="post" action="sample.asp"> <input type="text" name="name"> <input type="text" name=" "> </form>
4
2. Button submit กำหนดส่งค่าจากส่วนประกอบต่างๆ ใน Form (Element) ไปยัง Web Server เพื่อทำการประมวลผล เราจะใช้งานร่วมกับ Form รูปแบบ <input type="submit" value="[comment]"> ตัวอย่าง <form name="form1" method="post" action="sample.asp"> <input type="text" name="name"> <input type="text" name=" "> <input type="submit" value="submit"> </form> เพิ่มเติมครับการสร้างปุ่ม Submit แบบรูปภาพ <input type="image" name="submit" value="submit" src="image-name">
5
3. Button reset กำหนด Clear ส่วนข้อมูลที่ได้ทำการใส่เข้าไปใน Textbox โดยจะทำการ Clear ข้อความใดๆ รูปแบบ <input type="reset" value="[comment]"> ตัวอย่าง <form name="form1" method="post" action="sample.asp"> <input type="text" name="name"> <input type="text" name=" "> <br> <input type="submit" value="Submit"> <input type="reset" value="Reset"> </form> เพิ่มเติมครับการสร้างปุ่ม Reset แบบรูปภาพ <input type="image" name="reset" value="reset" src="image-name">
6
4. Text Filed กำหนดช่องรับข้อมูลจะทำงานร่วมกับ Form โดยจะต้องแทรกใว้ในกรอบของ Form การอ่านค่าจาก Element ของ Text Filed <% var-name = Request.Form("data-name") %> หากต้องการแสดงค่าออกมา <% =Request.Form("data-name") %> รูปแบบ <input type="text" name="data-name"> เช่น <form name="form1" method="post" action="sample.asp"> <input type="text" name="name"> <input type="text" name=" "> <br> <input type="submit" value="Submit"> <input type="reset" value="Reset"> </form>
7
Sam5-1.asp ตัวอย่าง <html> <head> <form name="form1" method="post" action="sam5-2.asp"> ชื่อ <input type="text" name="name"> <br> นามสกุล <input type="text" name="surname"> <br> <br> <input type="submit" value="Submit"> <input type="reset"value="Reset"> </form> </body> </html>
8
5.Textarea Filed เป็นเหมือนกับ Text Filed แต่จะมีช่องกรอกข้อมูลที่ใหญ่ขึ้น การแทรกจะแทรกใว้ในกรอบของ Form เหมือนกับ Text Filed การอ่านค่าจาก Element ของ Textarea Filed <% var-name = Request.Form("data-name") %> หากต้องการแสดงค่าออกมาเลย <% =Request.Form("data-name")%> รูปแบบ <textarea name="data-name" cols="50" rows="3"></textarea> เมื่อ Cols=จำนวน ความกว้างของช่องกรอกข้อมูล Roes = จำนวนความสูงของช่องกรอกข้อมูล
9
ตัวอย่าง Sam5-4.asp <html> <body> ข้อความคือ : <% =request.form("comment") %> </body> </html> Sam5-3.asp <html> <body> <form name="form1" method="post" action="sam5-4.asp"> กรอกข้อมูล<br> <textarea name="comment" cols="50" rows="3"></textarea> <br> <input type="submit" value="Submit"> <input type="reset" value="Reset"> </form> </body> </html>
10
6. Check Box ใช้กำหนดว่ามีการเลือกหรือไม่ รูปแบบ กำหนดได้ 2 วิธีคือ
1.ให้ค่าว่างเปล่าโดยยังไม่มีการเลือก <input type="checkbox" name="data-name" value="[value]"> 2.ให้ค่ามีการเลือกใว้แล้ว <input type="checkbox" name="data-name" value="[value]" checked>
11
7. Radio Button ใช้กำหนด ให้มีการเลือกอย่างใดอย่างหนึ่ง การอ่านค่าจาก Element ของ Radio button <% var-name = Request.Form("data-name") %> หากต้องการแสดงค่าออกมาเลย <% =Request.Form("data-name") %>
12
1.ให้ค่าว่างเปล่ายังไม่มีการเลือก 2.ให้เลือกใว้แล้ว
รูปแบบ กำหนดได้ 2 แบบ 1.ให้ค่าว่างเปล่ายังไม่มีการเลือก <input type="radio" name="data-name" value="[value]"> 2.ให้เลือกใว้แล้ว <input type="radio" name="data-name" value="[value]" checked>
13
ตัวอย่าง Sam5-5.asp <html> <body> <form name="form1" method="post" action="sam5-6.asp"> <p>เลือกอายุ</p> <p> <input type="radio" name="old" value="1-5"> 1-5<br> <input type="radio" name="old" value="6-20"> 6-10<br> <input type="radio" name="old" value="11-15"> <br> <input type="radio" name="old" value="16-20"> <br> <input type="radio" name="old" value="21 ขึ้นไป"> 21 ขึ้นไป<br> <br> <input type="submit" name="Submit" value="Submit"> </p> </form> </body> </html>
14
<html> <body> <%=request
<html> <body> <%=request.form("old") %> </body> </html> Sam5-6.asp
15
8.List Menu ใช้กำหนดให้มีการเลือกอย่างใดอย่างหนึ่ง เหมือนกับ Radio Button ที่จะดูเรียบง่าย และประหยัดเนื้อที่มากกว่า Radio Button การอ่านค่าจาก Element ของ List Menu <% var-name = Request.Form("data-name") %> หากต้องการแสดงค่าออกมาเลย <% =Request.Form("data-name") %>
16
รูปแบบ <select name="data-name” size=“1”> <option value="value1">ข้อความ1</option> <option value="value2">ข้อความ2</option> <option value="value3">ข้อความ3</option> . . . <option value="valueสุดท้าย">ข้อความสุดท้าย</option> </select>
17
<html> <body> <form name="form1" method="post" action="sample2.asp"> <select name="old"> <option value="1-5">1-5</option> <option value="6-10">6-10</option> <option value="11-15">11-15</option> <option value="16-20">16-20</option> <option value="21 ขึ้นไป">21 ขึ้นไป</option> </select> <br> <input type="submit" name="Submit" value="Submit"> </form> </body> </html> Sam5-7.asp
18
9.Hidden Field เป็นการนำค่ากำหนดโดยการซ่อนค่าและตัวแปร
การอ่านค่าจาก Element ของ Hidden Filed <% var-name = Request.Form("data-name") %> หากต้องการแสดงค่าออกมาเลย <% =Request.Form("data-name") %> รูปแบบ <input type="hidden" name="data-name" value="[value]">
19
ตัวอย่าง Sam5-8.asp <html> <body> <form name="form1" method="post" action="sample2.asp"> <input type="hidden" name="I_name" value="นายวีระชัย นุกิจรัมย์"> <br> <br> <input type="submit" name="Submit" value="Submit"> </form> </body> </html>
20
<html> <body> <% =request
<html> <body> <% =request.form("I_name") %> </body> </html> การนำค่า Hidden Filed จากค่าตัวแปร ก็สามารถทำได้แบบง่าย ๆ ครับ <% name="นายวีระชัย นุกิจรัมย์“ %> <input type="hidden" name="I_name" value="<%=name%>"> Sam5-9.asp
21
แบบฝึกหัดที่ 1 กรุณาป้อนชื่อ :: น้ำหนัก (ก.ก.) :: ความสูง (ซ.ม.) ::
Hidden Field การวัดความสมบูรณ์ ผู้ชาย ผลต่างฯ = ความสูง-100 ผู้หญิง ผลต่างฯ = ความสูง -110 ถ้าน้ำหนักตัวมีค่าอยู่ในช่วงของผลต่าง บวก ลบ 5 แสดงว่า “ปกติ” ถ้าน้ำหนักตัวมีค่าน้อยกว่าในช่วงของผลต่าง บวก ลบ 5 แสดงว่า “ผอม” ถ้าน้ำหนักตัวมีค่ามากกว่าในช่วงของผลต่าง บวก ลบ 5 แสดงว่า “อ้วน” นิสิต ม.นเรศวร กรุณาป้อนชื่อ :: น้ำหนัก (ก.ก.) :: ความสูง (ซ.ม.) :: เพศ :: ชาย หญิง ช่วงอายุ :: OK Cancel ชื่อ :: สมชาย เป็น :: นิสิต ม.นเรศวร น้ำหนัก :: 70 ความสูง :: 171 อายุ :: 21-25 ผลการตรวจสอบ : ปกติ 11-20 21-25 26-30 31-35
22
แบบฝึกหัดที่ 2 Google Text Search :: Nu.ac.th
ให้เขียนหน้าจอเพื่อสั่งค้นหาข้อมูลผ่านเว็บ Google.com โดยใช้ URL เช่น หรือ
งานนำเสนอที่คล้ายกัน
© 2024 SlidePlayer.in.th Inc.
All rights reserved.