Pada tutorial kali ini anda akan belajar salah satu fitur terbaru yang ada di HTML 5.1 membuat forms validasi dengan form.reportValidity() Pada HTML 5.1 beserta source codenya .
Hallo semuanya kembali lagi di artikel dumet school , untuk sebelumnya saya telah membahas tentang salah satu fitur HTML 5.1 terbaru dan sekarang saya masih akan membahas tentang fitur terbaru dari HTML 5.1 yaitu membuat forms validasi dengan form.reportValidity() Pada HTML 5.1.
fungsi dari validasi ini adalah apabila jika form kosong tidak ada value nya maka akan muncul tanda bahwa forms tersebut kosong atau belum di isi, yang jadi pertanyaan adalah kan sudah ada atribute required buat handle itu ? nah bedanya dengan yang sekarang adalah adalah sebgai berikut.
sebelum melihat bedanya silahkan salin code berikut dan jalankan pada browser :
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
font-family: 'Roboto';
color: #333;
}
form {
margin-bottom: 10px;
padding: 6px;
width: 380px;
background: #f3f3f3;
}
input {
width: 180px;
vertical-align: middle;
}
</style>
</head>
<body>
<h2>Form validation</h2>
<form>
<label>
Mandatory input <input type="text" name="first-name" required />
</label>
<button type="submit">Submit</button>
</form>
<script>
document.querySelector('form').reportValidity();
</script>
</body>
</html>setelah di jalnkan hasilnya akan seperti ini :
setelah kita lihat maka kita akan tau bedanya, bedanya kalau pakai report.validity() adalah saat kita membuka pertamakali tanpa ada isi dari text-field dari form tersebut maka akan membeikan mark up atau tanda merah yang menandakan form tersebut dalam keadaan kosong, sementara reqired hanya akan muncul saat tombol submit di tekan. maka ksimpulanya keduanya antara atribute required dan report.validity() akan lengkap jika di gabungkan untuk membuat validasi.
oke teman-teman mungkin dari saya itu saja tentang membuat forms validasi dengan form.reportValidity() Pada HTML 5.1 , sampai bertemu pada artikel selanjutnya.
The post Membuat Forms Validasi Dengan Form.reportValidity() Pada HTML 5.1 appeared first on Kursus Website Terbaik.