Checkbox กับ Radio แตกต่างกันยังไง ควรใช้ตอนไหน - HTML

Checkbox เหมาะสำหรับการเลือกข้อมูลที่มีสามารถมีค่ามากกว่า 1 ค่า เช่น สร้างฟอร์มให้เลือกภาษาคอมพิวเตอร์ที่ชอบ ซึ่งมีโอกาสที่จะชอบมากกว่า 1 ภาษา หรือชอบทั้งหมด แบบนี้ควรใช้ Checkbox

Radio Button เหมาะสำหรับการเลือกข้อมูลที่เลือกได้เพียงค่าเดียว เช่น เพศ หรือ สถานะการสมรส แบบนี้ควรใช้ Radio Button

สรุป

Checkbox ใช้สำหรับเลือกได้มากกว่า 1 ค่าจากตัวเลือกทั้งหมด ส่วน Radio Button ใช้สำหรับเลือกได้เพียงค่าเดียวจากตัวเลือกทั้งหมด

ตัวอย่าง การสร้าง Checkbox

ภาษาคอมพิวเตอร์ที่ชอบ
<br/><input type="checkbox" value="php" name="lang[]"> PHP
<br/><input type="checkbox" value="python" name="lang[]"> Python
<br/><input type="checkbox" value="ruby" name="lang[]"> Ruby
<br/><input type="checkbox" value="java" name="lang[]"> Java

ตัวอย่าง การสร้าง Radio Button

สถานะการสมรส
<br/><input type="radio" value="t" name="married"> สมรสแล้ว
<br/><input type="radio" value="f" name="married"> โสด