รายวิชา คอมพิวเตอร์ (การเขียนเว็บไซต์โดยใช้โปรแกรม Deramweaver  MX
)

เรื่อง การสร้างฟอร์ม

1. การเริ่มต้นสร้าง Form เพื่อรับข้อมูล
       เว็บเพจเป็นสื่อที่ต่างจากเอกสารธรรมดา เพราะเป็นสื่อสองทางที่ผู้ใช้สามารถสื่อสารกับเจ้าของเว็บเพจได้ ปัจจุบันมีการใช้แบบฟอร์มในเว็บเพจเพื่อเก็บข้อมูล ตั้งแต่รายละเอียดของผู้เข้ามาเยี่ยมชมเว็บเพจ การสั่งซื้อสินค้า ไปจนถึงการรวบรวมความคิดเห็นเกี่ยวกับเรื่องต่างๆ ที่กำลังอยู่ในความสนใจ เช่น การเลือกตั้ง การลงคะแนนความคิดเห็น เป็นต้น
Forms คือช่องกรอกแบบฟอร์มที่เราเจอตามตามเวบทั่วไป เวบมาสเตอร์ใช้ส่วนนี้รับข้อมูลจากผู้เข้าชมเวบ ไม่ว่าจะเป็นประวัติส่วนตัว ผลโวตต่างๆ หรือ Search หาข้อมูล
       การรับข้อมูลของการกรอกแบบฟอร์ม สามารถรับได้สองทางคือให้ส่งมาทางเมล์หรือส่งเข้าโปรแกรมที่เราได้เขียนไว้ที่ Server เช่น ( perl , C , java )
เริ่มต้นกับเครื่องมือสร้างฟอร์ม
       เครื่องมือของอ็อบเจ็กต์ฟอร์มเลือกได้จากแท็บ Forms
       สำหรับแต่ละส่วนประกอบย่อยของฟอร์มเรียกว่าฟิลด์ โดยจะมีอยู่หลายแบบ ซึ่งเราสามารถนำมา
ใช้งานได้อย่างเหมาะสม
Filed
ชื่อฟิลด์
การใช้งาน
Insert Form สร้างฟอร์ม
Text Field ฟิลด์กรอกข้อความ
Hidden Field ฟิลด์ซ่อน
Textarea ฟิลด์กรอกข้อความแบบหลายบรรทัด
Check box เช็คบ็อกซ์
Radio Button ตัวเลือก
Radio Group กลุ่มตัวเลือก
List/Menu ลิสต์รายการ
Jump menu รายการเชื่อมโยง
Image Field ฟิลด์รูปภาพ
File Field กรอบสำหรับเลือกไฟล์
Button ปุ่มกด
Label ฟิลด์แถบข้อความ
Fieldset ฟิลด์จัดกลุ่มฟอร์ม
 
การสร้างฟอร์ม
       เริ่มแรกเราต้องกำหนดขอบเขตของฟอร์มบนหน้าเว็บเพจก่อน โดยเลือก ที่แท็บออบเจ็กต์จะเกิดเส้นประสีแดงล้อมรอบพื้นที่ที่เรากำหนดให้เป็นฟอร์ม จากนั้นให้เราปรับขนาดพื้นที่ฟอร์มตามต้องการและเพิ่มออบเจกต์ต่างๆ ของฟอร์มเข้าไปในพื้นที่นั้น
จากนั้นภายในหน้า Document จะมีเส้นประแสดงขอบเขตของ Form คือไม่ว่าจะเป็น Text Field Checkbox Radio Button ต้องสร้างไว้ภายในเส้นประสีแดงนี้เท่านั้นเพราะจะมีผลในตอนใส่ Action ไปที่ Server
เราจะได้ Form area มาเป็นกรอบเส้นประสีแดง Form Object ที่เหลือในเส้นประนี้ (สำหรับคนที่มองไม่เห็นให้กำหนด View > Visual Aida > invisible element ก็จะเห็นได้)
       การสร้างฟอร์มใดๆ จำเป็นจะต้องสร้างในกรอบสีแดงนี้เท่านั้น เมื่อดูใน Browser ถึงจะ
แสดงเป็นรูปฟอร์มให้กรอกขึ้นมา ถ้าเห็นว่าช่องเล็กไปให้คลิกในกรอบสีแดง จากนั้นให้กด Enter เพื่อขยายกรอบให้มีหลายบรรทัดก็ได้
Form properties
Form Name : ชื่ออ้างอิงของ Form จำเป็นมาก มีประโยชน์ในการเขียนโปรแกรม ปกติโปรแกรมจะตั้งไว้ให้คือ Form1
Action : เรียกไฟล์จะมาจัดเก็บข้อมูลให้กับ Form ซึ่งอาจจะเป็น ไฟล์ Java หรือที่เขียนจาก Perl
Method : ลักษณะการส่งข้อมูลมีอยู่สองแบบคือ Get , Post
Get : การส่งข้อมูลแบบ get จะรวมข้อมูลเป็น URL ส่งไปที่ Server ข้อมูลจะได้ไม่เกิน 8192 ตัวอักษร ดังนั้นไม่ควรใช้กับฟอร์มยาวๆ (นิยมใช้กับ search engine )
Post : การส่งข้อมูลแบบ post ส่งแบบฟอร์มโดยรวมมาเป็น massage
ค่า defaule จะตั้งค่าเป็นแบบ get