Peristiwa oninvalid

Peristiwa DOM Objek Event

Definisi dan penggunaan

Peristiwa oninvalid terjadi saat elemen <input> yang dapat disubmit tidak valid.

Contoh, jika diatur atribut required, dan field kosong, input field tidak valid (atribut required menentukan input field harus diisi sebelum mengirimkan formulir).

Contoh

Contoh 1

Jika bidang input tidak valid, tampilkan beberapa teks:

<input type="text" oninvalid="alert('You must fill out the form!');" required>

Coba Sendiri

Ada banyak contoh TIY lainnya di bawah halaman.

Sintaks

Dalam HTML:

<element oninvalid="myScript">

Coba Sendiri

Dalam JavaScript:

objek.oninvalid = function(){myScript};

Coba Sendiri

Dalam JavaScript, gunakan metode addEventListener():

objek.addEventListener("invalid", myScript);

Coba Sendiri

Keterangan:Internet Explorer 8 atau versi yang lebih awal tidak mendukung metode addEventListener().

Detil teknis

Bubbling: Tidak didukung
Dapat dibatalkan: Dukungan
Tipe peristiwa: Event
Tag HTML yang didukung: <input>
Versi DOM: Peristiwa Level 3

Dukungan browser

Angka di tabel menunjukkan versi browser pertama yang mendukung peristiwa ini penuh.

Event Chrome IE Firefox Safari Opera
oninvalid Dukungan 10.0 Dukungan Dukungan Dukungan

Beberapa contoh lain

Contoh 2

Jika bidang input berisi kurang dari 6 karakter, tampilkan beberapa teks:

Name: <input type="text" id="myInput" name="fname" pattern=".{6,}" required>
<script>
document.getElementById("myInput").addEventListener("invalid", myFunction);
function myFunction() {
  alert("Must contain 6 or more characters");
}
</script>

Coba Sendiri

Contoh 3

Jika bidang input berisi angka yang kurang dari 2 atau lebih besar dari 5, tampilkan beberapa teks:

Number: <input type="number" id="myInput" name="quantity" min="2" max="5" required>
<script>
document.getElementById("myInput").addEventListener("invalid", myFunction);
function myFunction() {
  alert("Anda harus memilih angka antara 2 dan 5. Anda memilih: " + this.value);
}
</script>

Coba Sendiri

Halaman Terkait

Panduan JavaScript: Formulir JavaScript

Peristiwa DOM Objek Event