Quantcast
Channel: Kursus Website Terbaik
Viewing all articles
Browse latest Browse all 2170

Membuat Klonisasi Teks pada Form Input menggunakan Jquery

$
0
0

Hallo teman-teman, pada kesempatan kali ini saya akan membahasa cara Membuat Klonisasi Teks pada Form Input menggunakan Jquery. Sebelum langsung ke pembahasan kalian harus mengetahui dulu tentang klonisasi teks pada form input.

Oke sebagai contoh seperti ini : saat saya mengisikan data alamat email dan Retype alamat email pada sebuah website terdapat pemberitahuan yang menanyakan apakah Alamat email sama dengan retype alamat email yang anda isi? Kalau tidak sama akan error dan harus mencocokan kembali alamat email dengan retype alamat email. Nah jadi klonisasi adalah mengikuti atau mencocokan data yang kita ketik diform input sebelumnya.

Oke kalau masih bingung langsung saja kita praktekan.

Pertama-tama buat file htmlnya lalu ketik script html dibawah ini :

<html> 
 <head> 
    <title>Klonisasi text pada form input</title> 
 </head> 
  <body> 
  <form> 
   <p>Alamat Email : <input type="text" id="inputbox1"></p> 
   <p>Retype Alamat Email : <input type="text" id="inputbox2"></p> 
    <input type="submit" value="Proses"> 
  </form> 
  </body> 
</html>

Jika sudah, lanjut ketik script javascript dibawah ini lalu diletakan script ini didalam tag head html yang tadi :

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.js"></script> 
  <script type="text/javascript"> 
    $(document).ready(function() { 
         $("#inputbox1").keyup(function() { 
             var klonisasi = $(this).val(); 
             $("#inputbox2").val(klonisasi); 
         }); 
      });   
  </script>

Jika sudah silahkan kalian jalankan/run dibrowser masing masing dan coba lihat hasilnya akan jadi seperti gambar dibawah ini :

Membuat Klonisasi Teks pada Form Input menggunakan Jquery

Oke jika sudah seperti gambar diatas berarti kalian telah berhasil Membuat Klonisasi Teks pada Form Input menggunakan Jquery.

Sekian penjelasan singkat dari saya tentang cara Membuat Klonisasi Teks pada Form Input menggunakan Jquery. semoga dapat bermanfaat.

Sekian dan terimakasih sampai bertemu di pertemuan selanjutnya.

The post Membuat Klonisasi Teks pada Form Input menggunakan Jquery appeared first on Kursus Website Terbaik.


Viewing all articles
Browse latest Browse all 2170

Trending Articles