Javascript – Input Form Otomatis Setelah Radio Button di Klik

Javascript – Input Form Otomatis Setelah Radio Button di Klik. Sebuah pengaturan dan desain form input agar menjadi lebih simpel dan elegan Perlu sekali penggunaan javascript sebagai tambahan untuk membuat desain lebih atraktif, seperti misalnya pada form yang kita gunakan untuk mengiput sebuah data.

Pada kasus ini saya akan membuat sebuah form yang otomatis muncul ketika pilihan radio button di klik. Cara simpel hanya butuh beberapa baris kode saja, simak tutorialnya berikut ini,

Input Form Otomatis Setelah Radio Button di Klik

Berikut ini fungsi javascript yang akan kita gunakan untuk memunculkan form berikutnya pada sebuah web atau blog.

<script type="text/javascript">
 function yesnoCheck() {
 if (document.getElementById('yesCheck').checked) {
 document.getElementById('ifYes').style.display = 'block';
 }
 else document.getElementById('ifYes').style.display = 'none';

</script>

Menampilkan Form berikutnya

<form method="post" action="" >
 <p><input type="radio" onclick="javascript:yesnoCheck();" name="yesno" id="noCheck" checked><strong>Automatic</strong>
 <input type="radio" onclick="javascript:yesnoCheck();" name="yesno" id="yesCheck"><strong>Custom</strong>
 </p>
 <p><labe><strong> Url:</strong></label><input type="text" name="url" size="45" />
 <span id="ifYes" style="display:none" ><strong> Custom:</strong><input type="text" name="custom" size="45" class="icustom"/><br/>
 <p><input type="submit" name="submit" id="Submit" value="Shorten" /></p>
 <div id="result"></div>
 </form>

Ouput

Sebelum di klik

Sesudah di klik

Demikian tutorial singkat javascript muncul otomatis semoga membantu.

Klik WA: 082285417494