Jquery Datepicker

Cara Membuat Input Tanggal dengan jQuery DatePicker

Bagi teman para developer web mungkin tidak merasa absurd lagi dengan jQuery DatePicker. Ini biasa dipakai dalam pengembangan web yang memerlukan input penanggalan menurut kalender yang dilekatkan pada bidang form input.

Cara kerja yang sederhana, DatePicker ini berfokus pada input (klik, atau memakai tombol tab) untuk membuka sebuah kalender interaktif dengan sedikit overlay. Pilih tanggal, klik di daerah lain pada halaman (blur input), atau tekan tombol Esc untuk menutup. Jika tanggal yang dipilih, umpan balik ditampilkan sebagai nilai input.

JQuery UI Datepicker ialah plugin sangat sanggup dikonfigurasi yang menambahkan fungsi datepicker ke halaman Anda. Anda sanggup menyesuaikan format tanggal dan bahasa, membatasi rentang tanggal yang dipilih dan menambahkan tombol dan pilihan navigasi lainnya dengan mudah.

Secara default, kalender datepicker terbuka dengan sedikit overlay dikala bidang teks terkait mencapai fokus. Untuk kalender inline, cukup melampirkan datepicker dengan div atau span.

Sekarang kita buat form input sederhana sebagai tampilan inputannya.

Beberapa file jQuery dibawah ini perlu ditambahkan untuk menampilkan inputan penanggalan biar jQuery DatePicker ini sanggup berfungsi dengan baik, terdapat dua JavaScript dan satu stylesheet jQuery:

Kita masukan ketiga file di atas sehabis elemen <head>

Nah, script ini yang paling penting untuk dimasukan, lihat atribut id yang tertera di dalam form input dengan yang diberi nilai datepicker, sehingga script-nya dibuat: