Input Object แบบที่ 4 select
รูปแบบการสร้าง input แบบ select นั้นเป็น ดังต่อไปนี้ครับ
**การใช้ select นั้นมีการเปิด tag ที่ไม่เหมือน input ทั่วไป คือ เริ่มต้นเปิดด้วย <select> แล้วปิดด้วย </select> และมีการใส่รายการข้างในลงไป ด้วยการเปิด tag <option> และปิดด้วย</option>
โค้ด: เลือกทั้งหมด
<select name="ชื่อของ select input" id="ไอดี select input">
<option value="ค่าของตัวเลือก">ตัวเลือกที่ผู้ใช้มองเห็น</option>
</select>
ตัวอย่างที่ 1
โค้ด: เลือกทั้งหมด
<select name="prov" id="prov">
<option value="กรุงเทพฯ">กรุงเทพมหานคร</option>
<option value="อยุธยา">พระนครศรีอยุธยา</option>
<option value="อ่างทอง">อ่างทอง</option>
<option value="สมุทรปราการ">สมุทรปราการ</option>
</select>
ตัวอย่างที่ 2
เหมือนกับ checkbox และ radio อีกแล้ว ซึ่งเวลาผู้ใช้เคยเลือกจังหวัดไปแล้ว และต้องการกลับมาแก้ไขข้อมูล ระบบจะต้องเลือกจังหวัดที่ผู้ใช้เคยเลือกไว้แบบอัตโนมัติเลย แต่ ใน ส่วนของ select input นั้น เราจะเพิ่ม
selected="selected" แทน ซึ่งต่างจาก checkbox และ radio ที่ใช้ checked
โค้ด: เลือกทั้งหมด
<select name="prov2" id="prov2">
<option value="กรุงเทพฯ" selected="selected">กรุงเทพมหานคร</option>
<option value="อยุธยา">พระนครศรีอยุธยา</option>
<option value="อ่างทอง">อ่างทอง</option>
<option value="สมุทรปราการ">สมุทรปราการ</option>
</select>