Jumat, 21 September 2018

Membuat Datepicker Bootstrap dan Jquery

Membuat Datepicker

Datepicker adalah alat input yang digunakan untuk tanggal dengan bentuk box
dengan desain dalam bentuk kalender.

Membuat Datepicker ada beberapa cara :
1.    Datepicker menggunakan Jquery
2.    Datepicker Bootstrap

Cara Membuat Datepicker Menggunakan Jquery

1.     Masukkan code dibawah ini didalam <head> sintak HTML.
             Code dibawah berfungsi untuk tampilan.

2.   Masukkan code dibawah ini didalam <head> sintak HTML.
       Code dibawah berfungsi untuk perintah.
       

       Untuk poin 1 dan 2 hanya memanggil secara otomatis.
       Apabila koneksi internet tidak ada, Code tersebut tidak akan berfungsi.

3.    Masukkan code dibawah ini didalam <head> sintak HTML.
        
4.    Copy code dibawah ini didalam <body> sintak HTML.
       <p>Date: <input type="text" id="datepicker"></p>

       Pada poin 3 didalam script sudah dibuat ID dengan nama "datepicker", 
        maka pada tampilan di poin 4, ID tersebut kita panggil.


Cara Membuat Datepicker Bootstrap

1.     Masukkan code berikut pada gemfile.
gem 'bootstrap-datepicker-rails'

2.   Lalu install gem tersebut pada dengan memasukkan code dibawah pada terminal. 
   bundle install

3.     Masukkan code dibawah pada file app/assets/stylesheets/application.css 
  *= require bootstrap-datepicker
# kalau memakai bootstrap v3 pakai yang ini :
*= require bootstrap-datepicker3

4.     Masukkan code dibawah pada file app/assets/javascripts/application.js
   //= require bootstrap-datepicker 

5.     Masukkan code dibawah pada folder view didalam file yang akan memakai 
      datepicker.
     



Tidak ada komentar:

Posting Komentar