parsleyjs.pdf

4
Anggri Yulio Pernanda Twitter : @anggriyulio Email : [email protected] Blog : http://anggriyulio.com Validasi Form dengan PARSLEY.JS

Upload: ukm-it-cybernetix

Post on 31-Dec-2015

28 views

Category:

Documents


0 download

DESCRIPTION

Menggunakan Prasley.js (plugin jQuery) untuk melakukan validasi form dengan mudah

TRANSCRIPT

Page 1: Parsleyjs.pdf

Anggri Yulio Pernanda Twitter : @anggriyulio

Email : [email protected]

Blog : http://anggriyulio.com

Validasi Form dengan

PARSLEY.JS

Page 2: Parsleyjs.pdf

http://cybernetix.or.id Halaman 2 dari 4

Mengapa perlu validasi form ?

Ada banyak pertimbangan mengapa perlu adanya validasi pada sebuah formulir

input, salah satunya membantu user untuk lebih mudah memahami form yang akan diisi,

contohnya pada pengisian form tanggal lahir, email, ataupun url. Jadi data yang diinputkan

oleh user menjadi seragam, misalkan format date yang harus DD-MM-YY ataupun url yang

diawali dengan http://.

Dan yang tak kalah pentingnya adalah untuk membantu keamanan dalam aplikasi

(Web) yang kita rancang. Bisa jadi tanpa adanya validasi data yang diinputkan, dapat

menjadi celah seperti SQL Injection yang kemudian dimanfaatkan oleh user yang tidak

bertanggung jawab untuk menyusup kedalam aplikasi kita.

Dan tak kalah penting dari yang tak kalah penting diatas adalah kenyamanan user,

sebagus dan sekeren apapun aplikasi yang kita rancang, tetap user lah yang menjadi juri

penilai. Dengan menyertakan informasi dari form input, dan notifikasi dari kesalahan input

benar-benar berpengaruh pada kenyamanan user.

Page 3: Parsleyjs.pdf

http://cybernetix.or.id Halaman 3 dari 4

Validasi pada aplikasi web terbagi menjadi dua. Pertama validasi disisi server, yang

dijalankan setelah data pada form dikirim, dan divalidasi menggunakan bahasa

pemrograman di server, apakah itu asp, jsp ataupun php. Kedua validasi disisi client, yang

dijalankan sebelum data pada form dikirim, dan biasanya dijalankan dengan Javascript atau

yang lainnya.

Okee, mari kita masuk lebih dalam !!

Parsley.js

Never write a single javascript line anymore to validate your forms FrontEnd. arsley will

do that for you – and do it right –, thanks to its powerful DOM-API !

Dengan sekumpulan kode yang bernama "Parsley.js", kita bisa melakukan validasi

form dengan mudah. Kita tidak perlu menulis satu baris javascript pun untuk melakukan

validasi. Jadi, yang kita lakukan hanya menambahkan attribut pada element form, dan

Parsley.js akan melakukan validasi dengan sendirinya ajiibb . . .

Page 4: Parsleyjs.pdf

http://cybernetix.or.id Halaman 4 dari 4

Sebagai contoh, jika kita ingin membuat sebuah validasi form, maka kita cukup

menambahkan attribut data-validate="parsley". Lalu tambahkan attribut pada input,

misalkan untuk yang bertipe email, maka kita tambahkan attribut data-type="email".

Seperti gambar dibawah :

Jika, dijalankan dan jika format email yang dimasukkan salah, maka akan terlihat seperti

gambar dibawah :

Simple kan . . ??

Untuk dokumentasi lengkap bisa dilihat di http://parsleyjs.org/documentation.html