Cara Membuat Checkbox dan Radio Button - HTML

Pada artikel sebelumnya kita sudah membahas cara membuat form input. Pada postingan kali ini saya akan mencoba menjelaskan bagaimana cara membuat checkbox dan Radio Button form. Fungsi dari kedua tipe ini adalah untuk memberikan pilihan sebuah nilai kepada user.

Checkbox

Checkbox bagian dari tag input yang hanya bernilai TRUE dan FALSE. Bilamana checkbox diberi check maka input bernilai TRUE dan terisi oleh value tag tersebut. Begitu juga sebaliknya. Simak skrip di bawah ini.
<form>
<input type="checkboxname="makanan1" value="nasi_goreng"> Nasi Goreng <br />
<input type="checkboxname="makanan2" value="mie_goreng"> Mie Goreng 
</form>
Maka skrip di atas akan menghasilkan tampilan seperti berikut
Nasi Goreng
Mie Goreng
Tipe input ini memberikan pilihan kepada user untuk tidak memilih atau memilih lebih input yang tersedia. Berbeda dengan radio button dimana pengguna wajib memilih salah satu dari pilihan data yang tersedia.

Radio Button


Radio Button adalah input data yang mana user harus memilih salah satu dari pilihan yang disediakan. Penulisan input ini seperti contoh di bawah ini

<form>
<input type="radioname="makanan" value="nasi_goreng"> Nasi Goreng <br />
<input type="radioname="makanan" value="mie_goreng"> Mie Goreng 
</form>
Skrip di atas akan menghasilkan tampilan seperti berikut
Nasi Goreng
Mie Goreng
Perbedaan pada input tipe ini bisa dilihat pada nilau dari name yang memiliki kesamaan yang menandai bawah pilihan ini adalah satu kesatuan. Hasil output atau value akan bernilai radio button yang terpilih.

Singkat saja, tidak banyak atribut dalam input tipe ini. Sama seperti input sebelumnya, Input ini hanya berupa tampilan dan masih belum bisa digunakan untuk memproses datanya. Anda perlu menambahkan skrip PHP untuk dapat memproses input ini.

Cukup sekian mengenai input pilihan. Ada beberapa input jenis pilihan seperti ini seperti select option dengan bentuk lain. Kita akan bahas pada tutorial berikutnya. Sampai jumpa.