มีหลายครั้งที่คุณสร้างหน้าเว็บที่คุณต้องประมวลผลการป้อนข้อมูลที่ส่งโดยผู้ใช้เช่นหน้าเข้าสู่ระบบการสร้างบัญชีใหม่หรือเพื่อส่งคำถามหรือความคิดเห็น ข้อมูลผู้ใช้ถูกรวบรวมและส่งไปยังเว็บเซิร์ฟเวอร์โดยใช้แบบฟอร์ม HTML แบบฟอร์มสามารถเพิ่มได้ด้วยเครื่องมือที่มีอยู่ภายในของ KompoZer คุณสามารถเพิ่มและแก้ไขรูปแบบฟิลด์ฟอร์มทั้งหมดที่สนับสนุน HTML 4.0 ได้ด้วย KompoZer แต่สำหรับบทแนะนำนี้เราจะทำงานกับข้อความพื้นที่ข้อความปุ่มส่งและรีเซ็ต
สร้างฟอร์มใหม่
KompoZer มีเครื่องมือแบบฟอร์มที่หลากหลายซึ่งคุณสามารถใช้เพื่อเพิ่มฟอร์มลงในเว็บเพจของคุณได้ คุณเข้าถึงเครื่องมือแบบฟอร์มโดยคลิกที่ปุ่มฟอร์มหรือเมนูแบบเลื่อนลงที่มาพร้อมกับแถบเครื่องมือ โปรดทราบว่าถ้าคุณไม่ได้เขียนสคริปต์การจัดการฟอร์มของคุณเองคุณจะต้องได้รับข้อมูลบางส่วนสำหรับขั้นตอนนี้จากเอกสารหรือจากโปรแกรมเมอร์ที่เขียนสคริปต์ นอกจากนี้คุณยังสามารถใช้แบบฟอร์ม mailto ได้ แต่ไม่สามารถใช้งานได้
- วางเคอร์เซอร์ไว้ในตำแหน่งที่คุณต้องการให้รูปแบบของคุณปรากฏบนหน้า
- คลิก ฟอร์ม บนแถบเครื่องมือ กล่องโต้ตอบคุณสมบัติของฟอร์มจะเปิดขึ้น
- เพิ่มชื่อสำหรับแบบฟอร์ม ชื่อนี้ใช้ในโค้ด HTML ที่สร้างขึ้นโดยอัตโนมัติเพื่อระบุฟอร์มและจำเป็นต้องใช้ คุณยังต้องบันทึกหน้าเว็บของคุณก่อนจึงจะสามารถเพิ่มแบบฟอร์มได้ หากคุณกำลังทำงานกับเพจใหม่ที่ไม่ได้บันทึกไว้ KompoZer จะแจ้งให้คุณบันทึก
- เพิ่ม URL ลงในสคริปต์ที่จะประมวลผลข้อมูลฟอร์มในฟิลด์ URL การทำงาน ตัวจัดการฟอร์มมักเป็นสคริปต์ที่เขียนด้วยภาษา PHP หรือภาษาฝั่งเซิร์ฟเวอร์ที่คล้ายกัน หากไม่มีข้อมูลนี้หน้าเว็บของคุณจะไม่สามารถดำเนินการใด ๆ กับข้อมูลที่ป้อนโดยผู้ใช้ KompoZer จะแจ้งให้คุณป้อน URL สำหรับตัวจัดการฟอร์มหากคุณไม่ได้ป้อน URL
- เลือกปุ่ม วิธี ใช้เพื่อส่งข้อมูลฟอร์มไปยังเซิร์ฟเวอร์ ทั้งสองตัวเลือกคือ GET และ POST คุณจำเป็นต้องรู้วิธีการที่สคริปต์ต้องการ
- คลิก ตกลง และฟอร์มจะถูกเพิ่มลงในเพจของคุณ
เพิ่มฟิลด์ข้อความลงในแบบฟอร์ม
เมื่อคุณได้เพิ่มฟอร์มลงในเพจที่มี KompoZer แล้วฟอร์มจะถูกระบุไว้ในหน้าด้วยเส้นประสีฟ้าอ่อน คุณเพิ่มช่องฟอร์มภายในพื้นที่นี้ นอกจากนี้คุณยังสามารถพิมพ์ข้อความหรือเพิ่มภาพได้เช่นเดียวกับที่คุณทำในส่วนอื่น ๆ ของหน้า ข้อความเป็นประโยชน์ในการเพิ่มข้อความแจ้งหรือป้ายกำกับเพื่อสร้างเขตข้อมูลเพื่อเป็นแนวทางสำหรับผู้ใช้
- เลือกตำแหน่งที่คุณต้องการให้ฟิลด์ข้อความไปในพื้นที่รูปแบบที่ระบุไว้ หากคุณต้องการเพิ่มป้ายกำกับคุณอาจต้องการพิมพ์ข้อความก่อน
- คลิก ลูกศรชี้ลง ถัดจาก ฟอร์ม บนแถบเครื่องมือและเลือกฟิลด์แบบฟอร์มจากเมนูแบบเลื่อนลง
- หน้าต่างฟิลด์ฟิลด์ฟิลด์จะเปิดขึ้น หากต้องการเพิ่มช่องข้อความให้เลือก ข้อความ จากเมนูแบบเลื่อนลงที่มีข้อความ ประเภทฟิลด์.
- ตั้งชื่อให้กับฟิลด์ข้อความ ชื่อนี้ใช้เพื่อระบุฟิลด์ในโค้ด HTML และสคริปต์การจัดการฟอร์มต้องการชื่อเพื่อประมวลผลข้อมูล คุณสามารถแก้ไขแอตทริบิวต์ที่เป็นตัวเลือกอื่น ๆ ได้ในกล่องโต้ตอบนี้โดยการเลือก คุณสมบัติเพิ่มเติม / คุณสมบัติที่น้อยลง หรือโดยการกดปุ่มแก้ไขขั้นสูง แต่ตอนนี้เราจะป้อนชื่อฟิลด์
- คลิก ตกลง และช่องข้อความปรากฏบนหน้า
เพิ่มพื้นที่ข้อความในแบบฟอร์ม
บางครั้งต้องใส่ข้อความจำนวนมากในแบบฟอร์มเช่นข้อความหรือช่องคำถาม / ความคิดเห็น ในกรณีนี้ฟิลด์ข้อความไม่เหมาะสม คุณสามารถเพิ่มฟิลด์เขตข้อมูลรูปแบบโดยใช้เครื่องมือแบบฟอร์ม
- วางเคอร์เซอร์ไว้ในร่างโครงร่างที่คุณต้องการให้พื้นที่ข้อความของคุณเป็น ถ้าคุณต้องการพิมพ์ป้ายชื่อมักเป็นความคิดที่ดีที่จะพิมพ์ข้อความฉลากให้กด Enter เพื่อย้ายไปยังบรรทัดใหม่จากนั้นเพิ่มฟิลด์ของฟอร์มเพราะขนาดของพื้นที่ข้อความบนหน้าทำให้ไม่สะดวกสำหรับ ป้ายกำกับจะอยู่ทางซ้ายหรือขวา
- คลิก ลูกศรชี้ลง ถัดจาก ฟอร์ม บนแถบเครื่องมือและเลือก ข้อความ พื้นที่ จากเมนูแบบเลื่อนลง หน้าต่าง Text Area Properties จะเปิดขึ้น
- ป้อนชื่อสำหรับฟิลด์พื้นที่ข้อความ ชื่อระบุฟิลด์ในโค้ด HTML และใช้สคริปต์การจัดการฟอร์มเพื่อประมวลผลข้อมูลที่ผู้ใช้ส่งมา
- ป้อนจำนวนแถวและคอลัมน์ที่คุณต้องการให้พื้นที่ข้อความแสดง มิติข้อมูลเหล่านี้จะกำหนดขนาดของฟิลด์ในหน้าและสามารถป้อนข้อความลงในฟิลด์ได้ก่อนที่การเลื่อนจะต้องเกิดขึ้น
- คุณสามารถระบุตัวเลือกขั้นสูงเพิ่มเติมกับตัวควบคุมอื่น ๆ ในหน้าต่างนี้ได้ แต่ตอนนี้ชื่อฟิลด์และมิติข้อมูลเพียงพอแล้ว
- คลิก ตกลง และพื้นที่ข้อความจะปรากฏในแบบฟอร์ม
เพิ่มปุ่มส่งและตั้งค่าใหม่ในแบบฟอร์ม
หลังจากที่ผู้ใช้ป้อนข้อมูลในแบบฟอร์มบนหน้าเว็บแล้วจำเป็นต้องมีข้อมูลสำหรับส่งข้อมูลไปยังเซิร์ฟเวอร์ นอกจากนี้หากผู้ใช้ต้องการเริ่มต้นใหม่หรือทำผิดพลาดจะมีประโยชน์รวมถึงตัวควบคุมที่จะรีเซ็ตค่ารูปแบบทั้งหมดให้เป็นค่าเริ่มต้น ตัวควบคุมฟอร์มพิเศษจัดการกับฟังก์ชันเหล่านี้เรียกว่าปุ่มส่งและรีเซ็ตตามลำดับ
- วางเคอร์เซอร์ไว้ในพื้นที่แบบฟอร์มที่ระบุซึ่งคุณต้องการให้ปุ่มส่งหรือรีเซ็ตเป็น ส่วนใหญ่เหล่านี้จะอยู่ด้านล่างฟิลด์ที่เหลือในแบบฟอร์ม
- คลิก ลูกศรชี้ลง ถัดจาก ฟอร์ม บนแถบเครื่องมือและเลือก กำหนดปุ่ม จากเมนูแบบเลื่อนลง หน้าต่างคุณสมบัติปุ่มจะปรากฏขึ้น
- เลือกประเภทของปุ่มจากเมนูแบบเลื่อนลงที่มีข้อความว่า Type ตัวเลือกของคุณคือ Submit, Reset และปุ่ม ในกรณีนี้เราจะเลือก เสนอ ชนิด
- ระบุชื่อให้กับปุ่มซึ่งจะใช้ใน HTML และโค้ดการจัดการฟอร์มเพื่อประมวลผลคำขอแบบฟอร์ม นักพัฒนาเว็บมักจะตั้งชื่อฟิลด์นี้ว่า "submit"
- ในช่องที่มีข้อความ ราคาให้ป้อนข้อความที่ควรปรากฏบนปุ่ม ข้อความควรสั้น แต่อธิบายถึงสิ่งที่จะเกิดขึ้นเมื่อกดปุ่ม ตัวอย่างเช่น "ส่ง" "ส่งฟอร์ม" หรือ "ส่ง" เป็นตัวอย่างที่ดี
- คลิกตกลงและปุ่มปรากฏบนแบบฟอร์ม
รีเซ็ต สามารถเพิ่มลงในฟอร์มโดยใช้กระบวนการเดียวกัน แต่เลือก รีเซ็ต จาก ชนิด ฟิลด์แทน เสนอ.
การแก้ไขฟอร์มด้วย KompoZer
การแก้ไขรูปแบบหรือแบบฟอร์มใน KompoZer เป็นเรื่องง่ายมาก เพียงดับเบิลคลิกที่ฟิลด์ที่คุณต้องการแก้ไขและกล่องโต้ตอบที่เหมาะสมจะปรากฏขึ้นที่คุณสามารถเปลี่ยนคุณสมบัติของฟิลด์ให้เหมาะกับความต้องการของคุณ แผนภาพด้านบนแสดงแบบฟอร์มง่ายๆโดยใช้ส่วนประกอบที่ครอบคลุมในบทแนะนำนี้
