Tutorial Javascript Sederhana

Posted on by anggarajasa

Hari jumat kemarin teman saya satu ini, meminta bantuan saya untuk membuat skrip kode sederhana. Permasalahannya sederhana, ketika user memasukkan data pada textfield aplikasi otomatis akan menambahkan string “-” pada textfield. Namun batasannya, untuk menambahkan string “-” , user harus memasukkan +1 huruf dari huruf sebelumnya. Aduh piye yo jelaskannya hahaha.

Begini, inilah contoh hasil dari skrip saya satu ini. Kita ketak-ketik dari textfield maka harusnya begini 1-wd-fwq-fbas-f23o4- . Jadi lebih sederhananya adalah model deret aritmatika, penambahan string “-” hanya boleh dilakukan ketika huruf sebelumnya dikurangi 1 dari huruf yang ada. Sampai disini mestinya paham donk 😀

</code>
<html>
<head>

</head>
<body>
    <form name="testing">
         <input type="text" name="input1" onKeyUp="tambahkan_minus();"/>
    </form>
</body>

</html>
<script>
function tambahkan_minus(){
     var var1 = document.testing.input1.value;
     if(var1.length == 1){
         var result = var1+"-";
         document.testing.input1.value = result;
     }
     else{
         var array_explode = var1.split('-'); //mecah array berdasarkan string "-"
         var total_index_array = array_explode.length; //get length of array
         if(array_explode[total_index_array-1].length == total_index_array ){
              var result = var1+"-";
              document.testing.input1.value = result;
         }
     }
}
</script>
<code>

Sederhana sih logikanya. Kalo user masukin cuma satu huruf maka akan langsung ditambahkan string “-“. Nah ketika user menambahkan 1 huruf lagi kan tidak boleh ditambahkan “-” karena harus 2 huruf baru bisa ditambahkan “-“. Kondisi yang saya pakai, saya memakai fungsi explode nya javascript dan dari situ akan ketauan berapa banyak jumlah isi array ketika di explode.

Misalnya begini, setelah textfield terisi a- dan ketika dipecah maka array var array_explode berisi 2 yaitu a yang index-nya adalah [0] dan null dengan index-nya adalah [1]. Kondisi if berikutnya akan mengecek jika isi dari array_explode[2-1] dan of course ini adalah null dengan panjang sama dengan 2 (jumlah isi array setelah di-explode) maka akan ditambahkan string “-“.

Misalnya kita punya kondisi a-bc. Kondisi if nya seperti ini, array_explode[2-1] dan ini adalah string bc yang mempunyai panjang string 2 dan sama dengan jumlah isi array_explode maka otomatis ditambahkan string “-“.

Voila, dan anda sudah secara otomatis ketika melakukan deret aritmatika huruf +1 maka akan menambahkan string “-“. Semoga tutorial ini bermanfaat bagi kita semua.

Angga Rajasa

3 responses to “Tutorial Javascript Sederhana”

Leave a reply to sudionomas Cancel reply