Program HTML Input Type Radio

Hello guys, Berjumpa dengan Miniblog dari Inzaghi's Blog! Kali ini kita akan membuat Program HTML Input Type Radio untuk membuat Form seperti Pemilihan sesuatu.

Sumber : Dosenit.com, Jagongoding.com, Javatpoint.com, dan W3schools.com

Input Type Radio merupakan kolom isian bertipe pilihan di mana kita bisa menawarkan beberapa opsi kepada user. Akan tetapi hanya satu opsi saja yang boleh dipilih.

Contoh :

<form>
  Jenis Kelamin : <br />
  <div>
    <input id="lk" type="radio" name="jenis_kelamin" />
    <label for="lk">Laki-Laki</label>
  </div>
  <div>
    <input id="pr" type="radio" name="jenis_kelamin" />
    <label for="pr">Perempuan</label>
  </div>
  Bahasa Pemrograman Favorit : <br />
  <div>
    <input id="python" type="radio" name="bahasa_pemrograman" />
    <label for="python">Python</label>
  </div>
  <div>
    <input id="java" type="radio" name="bahasa_pemrograman" />
    <label for="java">Java</label>
  </div>
  <div>
    <input id="php" type="radio" name="bahasa_pemrograman" />
    <label for="php">PHP</label>
  </div>
  <div>
    <input id="cpp" type="radio" name="bahasa_pemrograman" />
    <label for="cpp">C++</label>
  </div>
</form>

Output :

Jenis Kelamin :

Laki-Laki

Perempuan

Bahasa Pemrograman Favorit :

Python

Java

PHP

C++

Pada pilihan di atas, kita hanya bisa memilih masing-masing satu saja.

Yang perlu diperhatikan adalah atribut name dari tiap radio button harus memiliki nilai yang sama dalam satu set pilihan. Pada contoh di atas, kita memiliki 2 buah set pilihan oleh karena itu namanya pun ada 2 yaitu jenis_kelamin dan bahasa_pemrograman.

Mohon maaf apabila ada kesalahan sedikit pun pada Kode Program ini.

Terima Kasih 😀😊😘👌👍 :)