Form คือ ส่วน (Section) ของเอกสาร (Document) ที่ประกอบด้วยอีลีเมนต์พิเศษ (Special element) ที่เรียกว่า ฟอร์มคอนโทรล (Form control)Form ใช้สาหรับการรับอินพุต (Input) จากผู้ใช้ (User) และจะมีการตอบสนองบางอย่างแก่ผู้ใช้
ข้อมูลที่กรอกเข้าไปโดยผู้ใช้ สามารถประมวลผลได้โดย Client-side scripts หรือสามารถ Submit ข้อมูลให้กับ Server เพื่อนาไปใช้ประโยชน์ให้มากยิ่งขึ้นไปอีกได้
ฟอร์ม (Form)
ข้อมูลที่กรอกเข้าไปโดยผู้ใช้ สามารถประมวลผลได้โดย Client-side scripts หรือสามารถ Submit ข้อมูลให้กับ Server เพื่อนาไปใช้ประโยชน์ให้มากยิ่งขึ้นไปอีกได้
ฟอร์ม (Form)
ตัวอย่าง Control ที่ใช้ใน Form เช่น
<input>
<textarea>
<select>
<label>
ตัวอย่างฟอร์ม
ตัวอย่างการนำ Form ไปใช้งาน
การเก็บชื่อ ที่อยู่ เบอร์โทรศัพท์ อีเมล์แอดเดรส และสารสนเทศอื่น ในการลงทะเบียนเพื่อใช้บริการต่าง ๆ
รวบรวมสารสนเทศการสั่งซื้อ เช่น ถ้าเราต้องการซื้อหนังสือผ่านอินเตอร์เน็ต เราต้องกรอกชื่อ อีเมล์แอดเดรส วิธีการจ่ายเงิน และข้อมูลอื่น ๆรวบรวมข้อมูลย้อนกลับ (Feedback) สาหรับเว็บไซต์ใช้สาหรับการทาเครื่องมือค้นหา (Search tool) สาหรับเว็บไซต์
อีลีเมนต์ form หรือแท็ก <form>
<form> </form>
อีลีเมนต์ <form> ถูกใช้เพื่อสร้างขอบเขตบนหน้าเพจเพื่อกาหนดบริเวณที่จะทาฟอร์ม
การใช้ <form> ให้กาหนดในแท็ก <body>
รูปแบบการใช้คาสั่ง
แอททริบิวต์ (Attribute) ที่ใช้ในฟอร์ม
ใน Formเราสามารถใช้ Attributeต่าง ๆ ดังนี้acceptไว้กาหนดชนิดของ MIME (Multipurpose Internet Mail Extensions) ที่สามารถเข้าใจได้โดยเครื่องแม่ข่าย (Server) ที่บรรจุสคริปต์Script เพื่อประมวลผล Formactionไว้กาหนดสถานที่ (Location) ของสคริปต์ (Script) ที่จะประมวลผล Form
method ไว้กาหนดวิธีการที่จะส่งข้อมูลสู่แม่ข่าย (Server) get เป็นตัวรับ-ส่งข้อมูลขนาดจากัดจากServer ไม่เกิน256 ตัวอักษรและปรากฏข้อมูลที่รับ- ส่ง ในช่อง Address ของ Browserpostเป็นตัวรับ-ส่งข้อมูลไม่จากัดจากServer และไม่ปรากฏข้อมูลที่รับ-ส่ง ในช่อง Address ของBrowser
MIME TypeMIME Type (Multipurpose Internet Mail Extention) ซึ่งเป็นการกาหนดชนิดข้อมูลมาตรฐานสาหรับอินเทอร์เนตในแบบ Content-type เป็นตัวบ่งชี้ว่าชนิดข้อมูลนั้นๆคืออะไร อาจแสดงเป็น type เปล่าๆ หรือ type/subtype เช่น Text, Text/html เป็นต้น MIME Type ประกอบด้วย
1. text ที่ใช้บ่อย ๆ -> text/plain text/html text/css text/javascript
2. image ที่ใช้บ่อย ๆ -> image/jpeg image/gif
3. audio ที่ใช้บ่อย ๆ -> audio/basic audio/mid audio/wav audio/mpeg
4. video ที่ใช้บ่อย ๆ -> video/mpeg video/x-msvideo (avi) video/quicktime
5. application ที่ใช้บ่อย ๆ -> application/postscript application/ pdf application/msword
อีลิเมนต์ <input>
typeไว้กาหนดชนิดของอีลีเมนต์ ได้แก่ text ,password,checkbox, radio, submit, reset, file, hidden, button ชนิดที่เป็น
Default คือ text
name ไว้กาหนดชื่อของ Control
valueไว้กาหนดค่าเริ่มต้นของ Control
sizeไว้กาหนดค่าความกว้างเริ่มต้นของ Controlmaxlengthไว้กาหนดจานวนสูงสุดของตัวอักษรที่สามารถกรอกลงในอีลี เมนต์ text หรือpassword ค่า Default คือ ไม่จากัดcheckedเป็น Boolean attribute ที่กาหนดให้ปุ่มเป็นสถานะถูกเลือก (On) Attribute นี้ถูกใช้เมื่อ Input type เป็น radio หรือ checkboxsrcใช้เมื่อ Input type เป็น image เป็นแอททริบิวต์ที่กาหนดแหล่งของ รูปภาพ
ชนิด (Type) ของ <input>
text เป็นค่าปกติ (Default)
password
checkbox
radio
submit
reset
file
hidden
button
name ไว้กาหนดชื่อของ Control
valueไว้กาหนดค่าเริ่มต้นของ Control
sizeไว้กาหนดค่าความกว้างเริ่มต้นของ Controlmaxlengthไว้กาหนดจานวนสูงสุดของตัวอักษรที่สามารถกรอกลงในอีลี เมนต์ text หรือpassword ค่า Default คือ ไม่จากัดcheckedเป็น Boolean attribute ที่กาหนดให้ปุ่มเป็นสถานะถูกเลือก (On) Attribute นี้ถูกใช้เมื่อ Input type เป็น radio หรือ checkboxsrcใช้เมื่อ Input type เป็น image เป็นแอททริบิวต์ที่กาหนดแหล่งของ รูปภาพ
ชนิด (Type) ของ <input>
text เป็นค่าปกติ (Default)
password
checkbox
radio
submit
reset
file
hidden
button
0 ความคิดเห็น:
แสดงความคิดเห็น