Javascript – Input Form Otomatis Setelah Radio Button di Klik

By , July 20, 2016,

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

sebelum klik Javascript - Input Form Otomatis Setelah Radio Button di Klik

sebelum klik Javascript – Input Form Otomatis Setelah Radio Button di Klik

Sesudah di klik

setelah klik Javascript - Input Form Otomatis Setelah Radio Button di Klik

setelah klik Javascript – Input Form Otomatis Setelah Radio Button di Klik

Demikian tutorial singkat javascript muncul otomatis semoga membantu.

Postingan berikutnya

  1. membuat form input dengan radio button javascript
  2. cara bikin inputan otomatis diklik php geogeafis
  3. script php menampilkan data otomatis ketika di klik
  4. otomatis butoon
  5. membuat inputan radio button dan text
  6. membuat form muncul hanya ketika di klik button
  7. kodingan javascript muncul kode otomatis
  8. kode klik booton otomatis di php
  9. jika radio yes maka menampilkan form 1 jika no form 2 di php
  10. java script radio button dengan 2 pilihan
  11. fungsi submit text button radio
  12. coding pada delphi untuk radio button yes no
  13. submit utomatis php dan javascib

Leave a Reply

Your email address will not be published. Required fields are marked *