การสร้างฟอร์ม

1. Form

2. Form
Form เป็นลักษณะของระบบสอบถามอย่างหนึ่ง เพื่อให้ผู้
ที่เข้ามาเยี่ยมชมกรอกข้อมูลต่างๆ ที่ผู้สร้าง Web Page
ต้องการ ซึ่งลักษณะของการสร้างแบบสอบถามนั้นมีอยู่
ด้วยกันหลายรูปแบบ

3. TEXTAREA
เป็นรูปแบบการเขียนข้อมูลแบบอิสระ (Free Form) คือ
ให้ผู้ใช้ป้อนข้อมูลลงไปในบริเวณที่เรากาหนดไว้ โดย
บริเวณความกว้างเป็นจานวน Column และความสูงเป็น
จานวน Row ใช้คาสั่ง
<textarea name=”name”> , </textarea>เป็น
รูปแบบการเขียนข้อมูลแบบอิสระ โดย name
คือชื่อของพื้นที่ที่เรากาหนด

4. SELECT
 เป็นการแสดงตัวเลือกมาให้ผู้ใช้เลือก โดยอาจแสดงในรูปของ Drop-
down List หรือแสดงตัวเลือกตามปกติก็ได้ใช้คาสั่ง <select> และ
</select>
 <select name=”name”> , </select> เป็นการแสดงตัวเลือกมาให้ผู้ใช้
เลือก โดย name คือชื่อของพื้นที่ที่เรากาหนด
จากผลลัพธ์ จะแสดงตัวเลือกให้เห็นเพียง 1 ตัวเลือก ถ้าต้องการเลือกตัวเลือก
อื่นๆ ให้คลิกที่ลูกศรเลื่อนลง
อาจมีการนาตัวเลือก multiple มาช่วย เพื่อให้ผลลัพธ์แสดงตัวเลือกทั้งหมดที่
มี โดยไม่ต้องคลิกเลือกที่ลูกศรเลื่อนลง

5. SELECT
<select name=”name” multiple> , </select> เป็นการแสดง
ตัวเลือกทั้งหมดมาให้ผู้ใช้เลือก โดย name คือชื่อของพื้นที่ที่เรา
กาหนด
ถ้าไม่ต้องการให้แสดงตัวเลือกทั้งหมด อาจมีการกาหนดจานวน
ตัวเลือกที่ต้องการให้แสดงไว้เลยก็ได้ โดยใช้ตัวเลือก size มาช่วย
<select name=”name” size=n> , </select> เป็นการแสดง
ตัวเลือกโดยจะแสดงให้เห็นทีละ n ตัวเลือก โดย name คือชื่อ
ของพื้นที่ที่เรากาหนด และ n คือ จานวนที่แสดงให้เห็น

6. INPUT
เป็นส่วนที่ใช้ป้อนข้อมูลภายใน 1 บรรทัด แต่กาหนดความยาว
ของกรอบและความยาวสูงสุดของข้อมูลที่ป้อนได้ด้วยใช้คาสั่ง
<input> ร่วมกับ
 <type> กาหนดชนิดของข้อมูลที่จะทาการป้อน ซึ่งแบ่งเป็นหลายแบบ ได้แก่
text (ข้อมูลทั่วไป)
 password (รหัสผ่านจะแสดงให้เห็นเป็น*) radio button (เป็น
วงกลมตัวเลือก) checkbox (เป็นสี่เหลี่ยมตัวเลือก) reset (สาหรับลบ
ข้อมูลทั้งหมดที่ป้อนมาทิ้งไป) submit (สาหรับส่งข้อมูลที่ป้อนไว้
ทั้งหมดไปให้กับผู้สร้างแบบสอบถาม) imape (เหมือน submit แต่
เป็นปุ่ มรูปภาพแทน)

7. INPUT
 <size> กาหนดความยาวของช่อง
 <maxlength> กาหนดจานวนสูงสุดของตัวอักษรที่จะป้อนลงใน
ช่อง
 <value>กาหนดค่าเริ่มต้นไว้ส่วนหน้าในช่องเติมข้อมูล
 <checked> กาหนดให้มีการเลือกตัวเลือกไว้ล่วงหน้า (สาหรับ
ในชนิด checkbox และ radio)

8. เพิ่มเติม
checkbox การตั้งชื่อ name จะแตกต่างกันออกไป เนื่องจากผู้ใช้
มีสิทธิ์เลือกได้มากกว่า 1 ดังนั้นไม่ควรตั้งชื่อให้เหมือนกัน
radio การตั้งชื่อจะเหมือนกัน เนื่องจากผู้ใช้มีสิทธิ์เลือกได้เพียง
1 ตัวเลือกเท่านั้น
ในการตั้งค่า value ในแบบสอบถามควรกาหนดค่า default
สาหรับตัวเลือกไว้ให้เลย จากตัวอย่างจะเลือก radio ไว้โดยใช้
คาสั่ง checked
ควรเคาะช่องว่างไว้ในข้อความของ value ด้วย เพื่อให้ปุ่ มมี
ระยะห่างกันบ้าง เพื่อความสวยงาม

9. จะใช้งาน Form ในงานจริงได้อย่างไร
Form ที่สร้างขึ้นมานั้นจะยังไม่สามารถใช้งานจริงๆ ได้
เนื่องจากยังไม่มีการระบุว่าจะจัดการอย่างไรกับข้อมูลที่ป้อน
การจัดการข้อมูลต่างๆ เหล่านี้กระทาโดยโปรแกรมย่อยๆ หรือ
Script ที่เรียกว่า Common Gateway Interface (CGI)
CGI เป็นโปรแกรมตัวกลางที่ทาหน้าที่เชื่อมโยงข้อมูลระหว่าง
เครื่องคอมพิวเตอร์ผู้ใช้ กับเครื่อง Server โดยสามารถรวบรวม
ข้อมูลที่ผู้ใช้ป้อนมาให้ เพื่อทาการประมวลผล เสร็จแล้วก็
สามารถส่งผลลัพธ์กลับไปยังผู้ใช้ได้

10. เมื่อนามาใช้งานจริง
เมื่อผู้ใช้ต้องการนา Form มาใช้งานจริงจะต้องใช้ร่วมกับคาสั่ง
ดังต่อไปนี้
 <action> ระบุชื่อ Script ที่ Server เรียกขึ้นมาเพื่อใช้ในการ
ประมวลผลที่ผู้ใช้ป้อนเข้ามา (เป็น CGI Script ที่มีอยู่ใน Web
Server)
 <enctype> ใช้สาหรับเข้ารหัสเพื่อรักษาความลับของข้อมูล โดย
ระบุเป็น MIME Type
 <method=get หรือ post> บอก Browser ว่าจะส่งข้อมูลไปที่
Server ด้วยวิธีใด โดยที่ get เป็นการนาข้อมูลไปต่อท้ายสุด แล้ว
ประมวลผลทีเดียว post เป็นการนาข้อมูลส่งไปที่ Server แยกกันไป
เป็นแต่ละ transaction

11. Thank