Assalamualaikum wr. wb. berbicara tentang form tentu tidak asing lagi dengan istilah “Validasi” apa itu validasi ? sederhananya validasi itu adalah pengecekan inputan, dulu sebelum release HTML5, para developer web memvalidasi inputan dengan menggunakan javascript atau PHP, seiring dengan pesatnya perke...

Validasi Form dengan HTML5

Assalamualaikum wr. wb.
berbicara tentang form tentu tidak asing lagi dengan istilah “Validasi” apa itu validasi ? sederhananya validasi itu adalah pengecekan inputan, dulu sebelum release HTML5, para developer web memvalidasi inputan dengan menggunakan javascript atau PHP, seiring dengan pesatnya perkembangan didunia web, sekarang validasi bisa dilakukan di sisi Client yaitu dengan menggunakan HTML5 validation.

apa saja HTML5 validasi itu, mari kita bahas bersama-sama.

 

Validasi Inputan tidak boleh kosong.

<form method="post" action="">

<input type="text" nama="user" required>

<input type="submit" name="ok" value="Masuk">

</form>

 

Attribute “required” mengharuskan form berisi value, apabila tidak diisi maka akan menampilkan pemberitahuan error, berikut contohnya.

Tampilan di Mozilla FIrefox.

Tampilan di Google Chrome.

 

Validasi inputan harus berisi angka.

<form method="post" action="">

<input type="number" nama="user">

<input type="submit" name="ok" value="Masuk">

</form>

 

Attribute type=”number” mengharuskan form diisi dengan value “angka”, apabila diisi selain angka maka akan memunculkan pemberitahuan error.

 

Tampilan di Mozilla FIrefox.

 

Tampilan di Google Chrome.

 

Validasi Inputan harus berupa URL/alamat web.

 

<form method="post" action="">

<input type="url" nama="user">

<input type="submit" name="ok" value="Masuk">

</form>

 

Attribute type=”url” mengharuskan form diisi dengan alamat web/url, apabila diisi selain “url/alamat web” maka akan menampilkan pemberitahuan error.

Tampilan di Mozilla FIrefox.

 

Tampilan di Google Chrome.

 

Validasi Inputan harus diisi dengan alamat email.

<form method="post" action="">

<input type="email" nama="user">

<input type="submit" name="ok" value="Masuk">

</form>

 

Attribute type="email" mengharuskan form diisi dengan alamat email, apabila diisi dengan selain email makan akan memunculkan pemberitahuan error.

Tampilan di Mozilla FIrefox.

Tampilan di Google Chrome.

 

 

 

Ok cukup sekian tutorial dari saya, semoga bermanfaat.
Wassalamualaikum wr.wb.


About Author

d-newbie

Adalah seorang ninja dari Coding Gakure, Menguasai jurus HTML no jutsu, CSS no jutsu, Javascript no jutsu, PHP no jutsu, dan MySQL no jutsu, jurus andalan adalah KageLooping no jutsu, yg bisa memperbanyak output sekali coding , ninja yang berasal dari TIM W3, dan diasuh oleh petapa genit yang suka menjilat-jilat situs yaitu google.com. :D #xixixi


Comment & Discussions

    Please LOGIN before if you want to give the comment.