Cara Validasi Formular Melalui Javascript Part 1

15/02/2016    Ekky Ridyanto    1186     Website

Pada bagian kedua tentang javascript ini kita akan melakukan validasi terhadap formularnya jadi sekarang dia tidak akan peduli jika inputan tersebut kosong dia akan mengirim nilai dari formularnya. Untuk itu kita ingin mencegahnya agar inputannya wajib di isi dan menampilkan pesan error jika inputan tersebut kosong. Oke kita akan buat formular seperti berikut

setelah itu kita akan tambahkan novalidate untuk menghilangkan validasi-validasi yang datang otomatis dari HTMLnya

dan event yang kita gunakan event onsubmit jadi onsubmit ini ketika user menekan tombol submit pada formularnya. Kita gunakan kata return lalu ada fungsi yang akan kita kembalikan namanya validasi() dan tambahkan parameter this untuk mengacu pada formularnya

kenapa kita mengoper formular tersebut karena kita akan banyak bermain dengan isi dari formularnya misalnya kita mengecek email, pesannya lalu mengubah warnanya masing masing dan menambahkan text error untuk itu kita ambil this nya yaitu formularnya. Selanjutnya kita akan buat script javascriptnya dan kita buat fungsi dengan nama validasi dan mengoper parameter this yang kita berikan nama form

jika teman teman masih belum terbayang saya lihatkan pada console. Jika teman teman ingin mengambil semua isi formularnya maka kita bisa ketikkan seperti ini

nanti isi dari this itu akan sama seperti gambar yang diatas yaitu kita punya semua isi dari formularnya. Misalnya ambil bagian nama textnya saja kita bisa mengambil nilai arraynya dari 0 kita bisa gunakan kode berikut

Oke itu dulu kita akan bahas pada artikel berikut dimana nanti kita akan buat fungsi validasi dari javascript tersebut. Terima kasih.

No data.

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More