Cara Cepat Membuat Datepicker Tanpa Bootstrap dan Jquery - Kodephp.id | Bagi anda yang tertarik dengan bahasa pemrograman Web seperti php dan html pastinya pada saat anda ingin membuat sebuah aplikasi yang harus di tuntut untuk mengunakan input tanggal (datepicker) pastinya kita akan bingung bagai mana sebuah input hanya dapat menampung format tanggal saya.
 |
| GAMBAR : LOGO HTML5 |
Banyak cara untuk menginput tanggal pada form di html seperti menggunakan Jquery dan datepicker bootstrap namun dengan menggunakan jquery dan bootstrap bagi anda yang baru berkecimpung di dunia pemrograman web pasti akan sedikit pusing dan dibingungkan membuat datepicker menggunakan jquery dan bootstrap sebab kode untuk membuat datepicker menggunakan bootstrap dan jquery cukup banyak dengan tambahan javascript dan juga css.
Namun ada cara termudah dalam membuat datepicker dalam pemrograman web yaitu menggunakan HTML 5, perlu anda ketahui HTML5 pada saat ini sudah medukung datepicker hanya saja datepicker HTML5 tidak memiliki tampilan yang cantik seperti jquery dan bootstrap namun sudah memenuhi kebutuhan anda untuk anda yang masih baru di dunia pemrograman website.
HTML 5 Datepicker masih memiliki beberapa kekurangan di bandingkan dengan jquery dan bootstrap yaitu hanya dapat di jalankan pada browser seperti chrome, Safari dan opera saja , untuk mozilla firefox dan internet exploler tidak mendukung HTML 5 Date picker ini.
Untuk menggunakan datepicker dengan html 5 anda cukup mengetikkan type=”date” pada input , untuk lebih jelasnya anda dapat mengikuti kode di bawah ini.
<!DOCTYPE html>
<html>
<body>
<form action="#">
Tanggal:
<input type="date" name="tanggal">
<input type="submit" value="SIMPAN">
</form>
</body>
</html>
Jika anda telah mengikuti kode di atas maka anda akan mendapatkan tampilan seperti di bawah ini.
 |
| TAMPILAN DATEPICKER |
Nah itulah Cara Cepat Membuat Datepicker Tanpa Bootstrap dan Jquery, semoga artikel ini bermanfaat bagi sobat pembaca sekalian.
Baca Juga : Membuat Kode PHP Untuk Menampilkan Data
14 komentar
setelah sekian lama... baru tau ane. makasih gan :D
Oke sama sama gan
cara ubah format tanggalnya gimana gan
kenapa di mozilla ngga kebaca ya gan, cuma kolom doang..
Di mozila memang tidak jalan hanya di chrome
simak artikelnya baik2 gan
HTML 5 Datepicker masih memiliki beberapa kekurangan di bandingkan dengan jquery dan bootstrap yaitu hanya dapat di jalankan pada browser seperti chrome, Safari dan opera saja , untuk mozilla firefox dan internet exploler tidak mendukung HTML 5 Date picker ini.
Untuk menggunakan datepicker dengan html 5 anda cukup mengetikkan type=”date” pada input , untuk lebih jelasnya anda dapat mengikuti kode di bawah ini.
maksudnya format gimana yah
bisa coba di bawah ini
datetime
datetime-local
misalnya mengubah format jadi yyyy-mm-dd gitu gan? klo defaultnya kan mm/dd/yy
misalnya mengubah format jadi yyyy-mm-dd gitu gan? klo defaultnya kan mm/dd/yy
sebenarnya untuk devault secara tampilan tidak ada perubahan sama sekali cukup tambahkan value="2012/10/01" secara otomatis saat di Post akan berubah yyyy-mm-dd
namun jika dirasa kurang maksimal bisa di tambahkan javascrip untuk merubahnya secara devaulth beserta tampilanya
bisa di lihat di sini http://jsfiddle.net/gaby/WArtA/
ebenarnya untuk devault secara tampilan tidak ada perubahan sama sekali cukup tambahkan value="2012/10/01" secara otomatis saat di Post akan berubah yyyy-mm-dd
namun jika dirasa kurang maksimal bisa di tambahkan javascrip untuk merubahnya secara devaulth beserta tampilanya
bisa di lihat di sini http://jsfiddle.net/gaby/WArtA/
jadi saya bikin ngelanjutin script orang yang udah ada javascriptnya jadi klo ditambahin jquery atau bootstrap jadi acak2n tampilannya makanya mau coba make yang tanpa jquery
kalu agan butuh bantuan , kirimkan scriptnya kepada kami melalui email ke admin@pecintabinatang.com , saya akan membantu mengerjakannya .. Terimakasih :)
sip gan terimakasih
Thanks gan sangat membantu
Berkomentarlah dengan baik.
Dilarang meninggalkan link hidup dan mengandung kata-kata yang kasar.
EmoticonEmoticon