1. รายงาน
เรื่อง Form
จัดทาโดย
ํ
นางสาวชุ ตมา ดาทอง เลขที่
ิ 13
นางสาวพจนา ตระกูลรัมย์ เลขที่ 18
ชั้นมัธยมศึกษาปี ที่ 5/2
เสนอ
คุณครูสุชาติ นาดี
รายงานเล่ มนีเ้ ป็ นส่ วนหนึ่งของรายวิชา ระบบเครือข่ ายคอมพิวเตอร์
โรงเรียนรมย์ บุรีพทยาคม รัชมังคลาภิเษก
ิ
สํ านักงานเขตพืนทีการศึกษามัธยมศึกษา เขต 32
้ ่
ประจําภาคเรียนที่ 2 ปีการศึกษา 2554

2. คํานํา
รายงานฉบับนี้เป็ นส่ วนหนึ่งของรายวิชาระบบเครื อข่ายคอมพิวเตอร์ รหัส ง 30203 โดยมี
จุดประสงค์เพื่อการศึกษาหาความรู ้เกี่ยวกับเรื่ อง Form ซึ่งเนื้อหาในรายงานฉบับนี้ประกอบด้วยเรื่ องเมนู
ชื่อภาษาไทยของForm หรื อ การใชงานในแต่ละเมนูของ Form เป็ นต้น ผจดทาหวงเป็ นอย่างยิงว่ารายงาน
้ ู้ ั ํ ั ่
ฉบบนี้จะให้ความรู ้ และเป็ นประโยชน์แก่ผอ่านทุก ๆ ท่าน
ั ู้
หากเนื้อหาในรายงานฉบับนี้มีขอผิดพลาดประการใดคณะผูจดทําต้องขออภัยมา ณ ที่น้ ีดวย
้ ้ั ้
คณะผจดทา
ู้ ั ํ

3. สารบัญ
เรื่อง หน้ า
ชื่อเมนู ชื่อภาษาไทยของฟอร์ม 1
การใช้งาน
-Form 2
-Text filds 3
- Button 5
-Checkbox 6
-Radio Button 6
-List/menu list 7
-File Field 8
-Image Filed 8
-Hidden filed 8

4. 1
เครื่องมือสร้างฟอร์ม
เครื่องมือของออบเจกตฟอร์มเลือกไดจากแทบ Forms
็ ็ ์ ้ ็
ู่
สําหรับแต่ละส่ วนประกอบย่อยของฟอร์มเรี ยกว่าฟิ ลด์ โดยจะมีอยหลายแบบ ซึ่งเราสามารถนํามา
ใช้งานได้อย่างเหมาะสม
Filed ชื่อฟิ ลด์ ชื่อภาษาไทย
Insert Form สร้างฟอร์ม
Text Field ฟิ ลด์กรอกข้อความ
Hidden Field ฟิ ลด์ซ่อน
ฟิ ลด์กรอกข้อความแบบหลาย
Textarea
บรรทัด
Check box เช็คบ็อกซ์
Radio Button ตวเลือก
ั
Radio Button กลุ่มตวเลือก
ั
List/Menu ลิสต์รายการ
Jump menu รายการเชื่อมโยง
Image Field ฟิ ลด์รูปภาพ
File Field กรอบสาหรับเลือกไฟล์
ํ
Button ป่ ุมกด
Label ฟิ ลด์แถบข้อความ
Fieldset ฟิ ลด์จดกลุ่มฟอร์ม
ั

5. 2
การใช้ งาน
Form
Forms คือช่องกรอกแบบฟอร์มที่เราเจอตามตามเวบทัวไป เวบมาสเตอร์ใช้ส่วนนี้รับข้อมูลจากผูเ้ ข้า
่
ชมเวบ ไม่วาจะเป็ นประวัติส่วนตัว ผลโวตต่างๆ หรื อ Search หาข้อมูล
่
การรับข้อมูลของการกรอกแบบฟอร์ม สามารถรับได้สองทางคือให้ส่งมาทางเมล์หรื อส่ งเข้า
โปรแกรมที่เราไดเ้ ขียนไวที่ Server เช่น ( perl , C , java )
้
การสร้ าง Form
• ใน Object palette ใหคลิกสามเหลี่ยมดานซายบนคางไวแลวเลือก Form
้ ้ ้ ้ ้ ้
• ใน Form panel ใหกดป่ ุม Insert Form ดงรูป
้ ั
• จากน้ นภายในหนา Document จะมีเส้นประแสดงขอบเขตของ Form คือไม่วาจะเป็น Text
ั ้ ่
Field Checkbox Radio Button ตองสร้างไวภายในเสนประสีแดงน้ ีเท่าน้ นเพราะจะมีผลในตอน
้ ้ ้ ั
ใส่ Action ไปที่ Server
• เราจะได้ Form area มาเป็นกรอบเสนประสีแดง Form Object ที่เหลือในเสนประน้ ี (สําหรับคน
้ ้
ที่มองไม่เห็นใหกาหนด View > Visual Aida > invisible element กจะเห็นได)้
้ ํ ็

6. 3
การสร้างฟอร์มใดๆ จาเป็นจะตองสร้างในกรอบสีแดงน้ ีเท่าน้ น เมื่อดูใน 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
่
Add object to form
Text filds
• คลิกที่ Insert text filds จะมีช่องสําหรับกรอกข้อความ
• ให้มาที่ Properties inspector สามารถกําหนดค่าต่างได้ดงนี้
ั

7. 4
• Type : Single line เป็นคาที่โปรแกรมเลือกใหอยแลว เป็นแบบใส่ขอความไดแถวเดียว สามารถ
่ ้ ู่ ้ ้ ้
กําหนดความกว้างของช่องได้ตามจํานวนตัวอักษรในช่อง Char Width และยังสามารถกําหนด
ตวอกษรใหพิมพไดไม่เกินตามที่เรากาหนด
ั ั ้ ์ ้ ํ
• Type : Multiline เป็ นการกําหนดให้กรอกข้อความได้หลายบรรทัดดังรู ปด้านบน เราสามารถ
ํ
กําหนดความกว้างได้ที่ Num Line ในตัวอย่างระบุ 10 บรรทัด ส่ วน Char Width กาหนดเป็น 20
ตวอกษรต่อแถว ในช่อง Wrap ใหกาหนดเป็น Defaul จะเป็นการตดบรรทดใหถาครบจานวน
ั ั ้ ํ ั ั ้ ้ ํ
20 ตวอกษร
ั ั
• Type : Password เป็นการกาหนดใหกรอกเป็นรหส ไม่วาจะพิมพอะไรลงไปจะแสดงออกมา
ํ ้ ั ่ ์
ํ
เป็ นเครื่ องหมาย ******* ตลอด สามารถกาหนดจานวนตวอกษรไดเ้ หมือน Single line
ํ ั ั

8. 5
Button
่
มีอยูสองแบบคือ ส่ งและลบข้อความทั้งหมด ( Submi / Reset ) หรื อ Send / Clear เราสามารถตั้งชื่อ
เป็ นชื่ออะไรก็ได้ตามต้องการ
• คลิก Button ใน Form Object
• ในตวอยางเป็นการใชป่ ุม Submit ซึ่งเป็ นค่าที่ทางโปรแกรมได้กาหนดให้ เราสามารถเปลี่ยนชื่อ
ั ่ ้ ํ
ไดในช่อง Label ส่วนในช่อง Action ถากาหนดใหป่ ุมน้ ีเป็นป่ ุมส่งขอความใหเ้ ลือก Submit
้ ้ ํ ้ ้
Form
• ตัวอย่างต่อไปเป็ นการใช้ปุ่มลบข้อความทั้งหมดที่ได้กรอกในแบบฟอร์ม
• ในช่อง Label กาหนดชื่อเป็น Clear ส่ วนช่อง Action ใหกาหนดเป็น Reset form ซ่ ึงจะเป็นการ
ํ ้ ํ
ลบข้อความทั้งหมดของฟอร์ม

9. 6
Checkbox
รู ปแบบคล้ายกับ radio button เพียงแต่สามารถทําเครื่ องหมายได้หลายช่องส่ วนมาจะใช้ในการ
สอบถามความต้องการต่างๆ
• คลิก Checkbox ใน Form Object
• ในตวอยางกาหนดใหทาการเลือกสีที่ชอบ เป็นสี Red , Green , Blue
ั ่ ํ ้ ํ
• Checked Value ใหใส่ชื่อใหสอดคลองกบหวขอที่ไดกาหนด จะมีผลในตอนเกบรวบรวมขอมูล
้ ้ ้ ั ั ้ ้ ํ ็ ้
• Initial State สามารถเลือกได้วาจะ Check ไวล่วงหนาหรือไม่
่ ้ ้
RadioButton
สามารถเลือกได้เพียงช่องเดียว ยกตัวอย่างเช่นการเลือกเพศ เช่น ชาย หรื อ หญิง
• คลิกที่ Radiobutton ใน Form Object
• Checked Value ให้กาหนดข้อมูลที่ตองการทราบ เช่น Man หรื อ Woman
ํ ้
• Initial State สามารถกาหนดเลือก Checked ไวที่ช่องใดช่องหน่ ึงกได้
ํ ้ ็

10. 7
List/menu list
จะเป็น list option ใหเ้ ลือกเช่น จานวนสมาชิกในบานท่าน มีใหเ้ ลือกแบบ list กับแบบ menu โดย
ํ ้
เซ็ตคาที่เลือกไดใน list value ค่า value จะเป็นค่าที่โปรแกรมนามาเกบไวในตวแปร
ํ ้ ํ ็ ้ ั
• คลิกที่ list menu ใน Form Object
• มาที่ Properties inspector
• Type เลือกวาจะใหเ้ ป็นแบบไหนระหวาง Menu กับ List
่ ่
• คลิกที่ List Value เพื่อกําหนดค่าตัวแปร
• คลิกเครื่ องหมาย + เพื่อเพิ่มตัวแปร ตัวอย่างเป็ นการสํารวจว่าผูใช้ส่วนมากใช้ E-mail ที่ใด
้
• คลิก Ok
• ผลลัพธ์ที่ได้

11. 8
File Field
ให้ผชม Upload ไฟล์มาเก็บไว้ที่เราได้ เช่น การส่ งภาพเข้าประกวด จะสังเกตุได้จากผูให้บริ การ e-
ู้ ้
mail จะใชในการแนบไฟล์
้
Image Filed
เลือกรู ปมาใช้แทนปุ่ ม Submit
Hidden filed
เป็น Form ที่ผเู ้ ข้าชมไม่สามารถมองเห็นได้ ไว้ใช้ comment หรื อส่ ง Value ใหโปรแกรมเท่าน้ น
้ ั
Jump Menu
ลักษณะการทํางานของ Jump menu จะเหมือนกับการนําคุณสมบัติของ Navigation bar กับ Listbox
แบบ menu มาผสมกัน โดยหน้าตาของมันจะเหมือนกับ Listbox ทุกอย่าง คือมีรายการให้เลือกได้ เพียงแต่
หลังจากที่ผใช้เลือกรายการเรี ยบร้อยแล้ว จะลิงค์ไปยังหน้าโฮมเพจอื่นๆ เหมือนกับการลิงค์ที่
ู้
Navigation bar น้ นเอง
ั

12. 9
ั ้ ํ ํ
ทนทีที่คลิกป่ ุม Insert Jump menu ก็จะปรากฏ Dialog box ซ่ ึงใชสาหรับกาหนดรายการตวเลือกและ
ั
หน้าโฮมเพจที่ตองการลิงค์
้
• เพิ่มรายการตัวเลือกลงในช่อง Menu Items โดยคลิกที่เครื่ องหมาย + ที่ปุ่มบนซ้าย
• ป้ อนชื่อหัวข้อหรื อรายการลงในช่อง Text
• กาหนดหนาโฮมเพจที่จะลิงคไปในช่อง When Selected Go To URL
ํ ้ ์
• ทําซํ้าข้อ 1-3 เพื่อเพิ่มรายการตัวเลือกจนครบ
• กาหนดวินโดวหรือเฟรมที่จะแสดงหนาโฮมเพจทุกๆ หนาที่ลิงคไปในช่อง Open URL In
ํ ์ ้ ้ ์
• กําหนดชื่อของ Jump Menu ในช่อง Menu Name
• เลือก Checkbox “ Insert Go Button After Menu “ หากตองการกาหนดใหมีป่ ุมคลิก GO อยู่
้ ํ ้
ข้างๆ Jump Menu ซ่ ึงใชกาหนดวาหลงจากที่ผใชเ้ ลือกหวขอรายการแลว จะยงไม่ลิงคไปหนา
้ ํ ่ ั ู้ ั ้ ้ ั ์ ้
่
โฮมเพจอื่น จนกวาจะคลิกป่ ุม GO
• เลือก Checkbox “ Select First Item After URL Chang “ สําหรับกําหนดให้แทบสี ฟ้าแสดงอยูที่
่
ตัวเลือกรายการแรก หลังจากที่มีการลิงค์ไปยังหน้าโฮมเพจอื่นแล้ว
• จากน้ นคลิก OK
ั

13. บรรณานุกรม
http://www.nr.ac.th/w/Dream/dream3.html
http://www.lpc.th.edu/eLearning/Subjects/Access/AC2.htm