Validasi Input

<form method="post" action="aksi.php" onsubmit="return validasi_input(this)">
<p>Username: <input name="username" type="text"></p>
<p><input name="" type="submit" value="Submit"></p>
</form>

Pada form tersebut terdapat kode onsubmit=”return validasi_input(this)” , dengan menggunakan fungsi onsumbit kita dapat membuat function javascript untuk validasi_input pada JavaScript sebelum ke action=”aksi.php”, Berikut Kode JS nya, letakkan di atas Form ya..
<script type="text/javascript">
function validasi_input(form){
  if (form.username.value == ""){
    alert("Username masih kosong!");
    form.username.focus();
    return (false);
  }
return (true);
}
</script>
2. Membatasi Minimal Input dengan Javascipt
Untuk Membatasi Jumlah Inputan , Kita dapat menggunakan Fungsi validasi di bawah ini , ( Gunakan Form diatas, dan ganti javascriptnya )
<script type="text/javascript">
function validasi_input(form){
  var mincar = 8;
  if (form.username.value.length < mincar){
    alert("Panjang Username Minimal 8 Karater!");
    form.username.focus();
    return (false);
  }
   return (true);
}
</script>
Script di atas berfungsi untuk membatasi jumlah inputan minimal sebanyak 8 Karakter

3. Membatasi Minimal inputan serta Huruf dan Angka dengan Javascipt
Gunakan form username saja sebagai contoh, dan ganti JavaScriptnya menjadi berikut
<script type="text/javascript">
function validasi_input(form){
   pola_username=/^[a-zA-Z0-9\_\-]{6,100}$/;
   if (!pola_username.test(form.username.value)){
      alert ('Username minimal 6 karakter dan hanya boleh Huruf atau Angka!');
      form.username.focus();
      return false;
   }
return (true);
}
</script>
 4. Validasi Radio Button dengan Javascript
<form method="post" action="aksi.php" onsubmit="return validasi_input(this)">
<p>Jenis Kelamin: <input type="radio" name="jk" value="L">Laki-Laki
<input type="radio" name="jk" value="P">Perempuan</p>
<p><input name="" type="submit" value="Submit"></p>
</form>
 Untuk Validasi Javascriptnya  :
<script type="text/javascript">
function validasi_input(form){
  function check_radio(radio)
  {
// memeriksa apakah radio button sudah ada yang dipilih
    for (i = 0; i < radio.length; i++)
    {
      if (radio[i].checked === true)
      {
        return radio[i].value;
      }
    }
   return false;
   }
   var radio_val = check_radio(form.jk);
   if (radio_val === false)
    {
      alert("Anda belum memilih Jenis Kelamin!");
      return false;
    }
   return (true);
}
</script>
5. Validasi Combobox dengan Javascript
<form method="post" action="aksi.php" onsubmit="return validasi_input(this)">
<p>Agama: <select name="agama">
          <option value="pilih" selected>--Pilih--</option>
          <option value="islam">Islam</option>
          <option value="kristen">Kristen</option>
          <option value="katolik">Katolik</option>
          <option value="hindu">Hindu</option>
          <option value="budha">Budha</option>
          </select></p>
<p><input name="" type="submit" value="Submit"></p>
</form>
 Untuk Validasi Combobox dengan Javacript berikut codenya :
<script type="text/javascript">
function validasi_input(form){
 if (form.agama.value =="pilih"){
    alert("Anda belum memilih agama!");
    return (false);
 }
return (true);
}
</script>
 6. Validasi Email dengan Javascript
<script type="text/javascript">
function validasi_input(form){
  pola_email=/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
  if (!pola_email.test(form.email.value)){
    alert ('Penulisan Email tidak benar');
    form.email.focus();
    return false;
  }
  return (true);
}
</script>

Comments

Popular posts from this blog

Menampilkan Data Dari ComboBox ke TextField di PHP

Cara Menampilkan Hasil Form HTML dengan JavaScript