วันจันทร์ที่ 22 เมษายน พ.ศ. 2556

การสร้างแบบสอบถาม


การสร้างแบบสอบถามในหน้าเว็บเพจนั้น เราสามารถทำได้ง่าย ๆ โดยการใช้แท็กคำสั่ง <FORM> เพื่อเริ่มต้นแบบสอบถาม และใช้แท็กคำสั่ง </FORM> เพื่อสิ้นสุด...แต่ลำพังแท็กคำสั่งเพียงคู่นี้คู่เดียว ยังไม่สามารถเป็นแบบสอบถามที่สมบูรณ์ได้ เราจะต้องมีช่องรับข้อมูล <INPUT TYPE> ที่มีรูปแบบต่าง ๆ กัน มาประกอบด้วย, <INPUT TYPE> ที่สามารถนำมาใช้ในแบบสอบถามได้ มีดังต่อไปนี้ครับ


แบบที่ 1 INPUT TYPE แบบ "TEXT"

<FORM>
      Name: ชื่อ-นามสกุล<BR>
      <INPUT TYPE="text" NAME="name" SIZE="30" MAXLENGTH=30><BR>
      Site Url: ที่อยู่เว็บไซต์ของคุณ<BR>
      <INPUT TYPE="text" NAME="siteurl" SIZE="30" MAXLENGTH=30 VALUE="http://"><BR>
</FORM>
ผลลัพธ์ที่ได้

Name : ชื่อ-นามสกุล

Site Url: ที่อยู่เว็บไซต์ของคุณ
อธิบายคำสั่ง
<INPUT TYPE="text">เป็นการกำหนดให้มีช่องรับข้อมูลแบบ TEXT
NAME="name"ชื่อของช่องรับข้อมูล (จะต้องมีชื่อไม่ซ้ำกันหากมีช่องรับข้อมูลมากกว่า 1 ช่อง)
SIZE="20"เป็นการกำหนดความกว้างของช่องรับข้อมูล
MAXLENGTH="30"เป็นการกำหนดความยาวสูงสุดของข้อมูล (จำนวนตัวอักษร)
VALUE="http://"เป็นการกำหนดค่าเบื้องต้นให้กับช่องรับข้อมูล




แบบที่ 2 INPUT TYPE แบบ "REDIO"

<FORM>
      คุณอายุเท่าใด:(เลือกเพียงข้อใดข้อหนึ่งเท่านั้น)<BR>
      <INPUT TYPE="radio" NAME="age" VALUE="20-30">20-30 ปี  
      <INPUT TYPE="radio" NAME="age" VALUE="31-40" CHECKED>31-40 ปี  
      <INPUT TYPE="radio" NAME="age" VALUE="41-50" DISABLED>41-50 ปี  
</FORM>
ผลลัพธ์ที่ได้

คุณอายุเท่าใด:(เลือกเพียงข้อใดข้อหนึ่งเท่านั้น)
20-30 ปี   <-- ค่าปกติ
31-40 ปี   <-- CHECKED
41-50 ปี   <-- DISABLED
อธิบายคำสั่ง
<INPUT TYPE="redio">เป็นการกำหนดให้มีช่องรับข้อมูลแบบ REDIO
NAME="age"ชื่อของปุ่มรับข้อมูล (ต้องเป็นชื่อเดียวกันทุกปุ่ม)
VALUE="20-30"เป็นกำหนดค่าหรือข้อมูลให้กับปุ่มรับข้อมูล
CHECKEDเป็นการกำหนดให้มีการเลือกปุ่มรับข้อมูลนี้เป็นเบื้องต้น
DISABLEDเป็นการกำหนดไม่ให้มีการเลือกปุ่มรับข้อมูลนี้




แบบที่ 3 INPUT TYPE แบบ "CHECKBOX"

<FORM>
      หัวข้อใดที่คุณชื่นชอบเป็นพิเศษ (เลือกได้มากกว่า 1 ข้อ)<BR>
       <INPUT TYPE="checkbox" NAME="Members">ทะเบียนรายชื่อสมาชิก<BR>
      <INPUT TYPE="checkbox" NAME="New page" CHECKED>แนะนำเว็บเพ็จใหม่<BR>
      <INPUT TYPE="checkbox" NAME="Techno" DISABLED>วิชาการ/บทความ<BR>
</FORM>
ผลลัพธ์ที่ได้

หัวข้อใดที่คุณชื่นชอบเป็นพิเศษ (เลือกได้มากกว่า 1 ข้อ)
ทะเบียนรายชื่อสมาชิก   <-- ค่าปกติ
แนะนำเว็บเพ็จใหม่        <-- CHECKED
วิชาการ/บทความ         <-- DISABLED
อธิบายคำสั่ง
<INPUT TYPE="checkbox">เป็นการกำหนดให้มีช่องรับข้อมูลแบบ CHECKBOX
NAME="Member"ชื่อของปุ่มรับข้อมูล (จะต้องมีชื่อไม่ซ้ำกันหากมีปุ่มรับข้อมูลมากกว่า 1 ปุ่ม)
VALUE="20-30"เป็นกำหนดค่าหรือข้อมูลให้กับปุ่มรับข้อมูล
CHECKEDเป็นการกำหนดให้มีการเลือกปุ่มรับข้อมูลนี้เป็นเบื้องต้น
DISABLEDเป็นการกำหนดไม่ให้มีการเลือกปุ่มรับข้อมูลนี้

ไม่มีความคิดเห็น:

แสดงความคิดเห็น