Halo teman – teman jumpa kembali dengan saya di webste tips dan trik Dumet School, pada artikel sebelumnya kita sudah membahas dan membuat Cara Membuat Validasi Form Input Email Dengan Javascript. Nah pada kesempatan kali ini saya akan memberikan tips dan trik tentang Cara Membuat Validasi Form Input Email Dengan Javascript kegunaannya sama seperti wajib angka untuk validasi, namun kali ini berbeda dengan validasi email. Sebenarnya dengan kita mengetikkan type=”email” pada form input sudah ada validasi terhadap inputan, apakah sudah benar email atau bukan. Jika email yang di masukkan form akan menerima dengan type=”email” tetapi jika diisikan selain format email akan di tolak oleh form. Nah pada studi case kali ini kita akan membuat validasi email dengan menggunakan Javascript dengan type=”text” tidak harus menggunakan type=”email” dan dengan menggunakan Javascript kita akan memakai alert untuk memberitahukan kepada user bahwa email yang di isikan belum benar. Untuk teman – teman cocok sekali ini digunakan untuk pembuatan form register.
Baik, kita lanjut praktek di artikel kali ini tentang Cara Membuat Validasi Form Input Email Dengan Javascript. Teman – teman siapkan text editornya dan ketikkan script html nya seperti gambar di bawah ini
Kemudian save dengan nama index.html, dan jalankan pada browsernya lalu isikan huruf, angka bukan format email
Kemudian klik input, maka form tidak akan valid namun data pada form tetap terkirim. Oke sekarang kita berikan fungsi Javascript nya, pertama – tama tambahkan fungsi onsubmit dan name pada form pembuka
Lalu tambahkan script Javascript nya di bawah ini
<script type="text/javascript">
function validateForm()
{
var x=document.forms["email"]["emailUser"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
{
alert("Isi Email dengan Benar");
}
}
</script>
Jika sudah save dan refresh pada browsernya, lalu ketikan pada form input bukan format email lalu klik tombol input maka validation sudah bisa digunakan. Validasi akan berjalan jika email yang di masukkan salah
Kita tambahkan satu fungsi lagi untuk memastikan data yang salah benar – benar di kembalikan pada kondisi false, teman – teman sisipkan return di dalam form dan di bawah alert kondisi false.
Jika sudah save dan jalankan pada browsernya, validasi sudah berhasil di buat dan bisa di gunakan. Baik sekian pada artikel kali ini tentang Cara Membuat Validasi Form Input Email Dengan Javascript kita berjumpa kembali pada tiprs dan trik yang akan datang. Terimakasih dan Sampai Jumpa