How To

Cara Membuat Validasi Empty Input

Di bawah ini kita akan mempelejari cara menambahkan validasi formulir untuk field inputan kosong dengan JavaScript. Seperti ini contoh validasi javascript untuk field inputan kosong:

<!DOCTYPE html>
<html>
<head>
<script>
function validateForm() {
  var x = document.forms["myForm"]["fname"].value;
  if (x == "" || x == null) {
    alert("Name must be filled out");
    return false;
  }
}
</script>
</head>
<body>

<h2> Validasi JavaScript untuk field inputan kosong </h2>
<p> Cobalah untuk mengirimkan formulir tanpa memasukkan teks apa pun. </p>

<form name="myForm" action="/action_page.php" onsubmit="return validateForm()" method="post" required>
  Nama: <input type="text" name="fname">
  <input type="submit" value="Submit">
</form>

</body>
</html>

Validasi Empty Input

Langkah 1) Tambahkan HTML:
Contoh

<form name="myForm" action="/action_page.php" onsubmit="return validateForm()" method="post" required>
  Name: <input type="text" name="fname">
  <input type="submit" value="Submit">
</form>

Langkah 2) Tambahkan JavaScript:
Jika kolom input (fname) kosong, fungsi ini akan memberi tahu pesan dan mengembalikan false untuk mencegah formulir dikirimkan:
Contoh

function validateForm() {
  var x = document.forms["myForm"]["fname"].value;
  if (x == "") {
    alert("Nama harus diisi");
    return false;
  }
}

Hanifah Nurbaeti

Share
Tags: formHow To