Mengatasi Bootstrap DateTimepicker Tidak Muncul Saat Input Readonly

Kasus yang pernah saya alami ini, mungkin dialami juga oleh beberapa orang ketika menggunakan library bootstrap datetimepicker. Ketika kita membuat input datetimepicker menjadi "readonly" yang mana tujuannya supaya user harus memilih tanggal dari datetimepicker yang sudah disediakan . Hal ini bertujuan untuk menghindari kesalahan format input tanggal dari user.

Baca juga :
                   Tutorial Membuat Input Tanggal dengan Kalender

Baik kita langsung saja dalam artikel yang berjudul "Mengatasi Bootstrap DateTimepicker Tidak Muncul Saat Input Readonly" ini, saya anggap teman teman sudah memahami dan mengerti setidaknya sedikit dari cara penggunaan library bootstrap datetimepicker ini. Biasanya secara umum penggunaan library bootstrap datetimepicker adalah sebagai berikut :

Script HTML

<div class='input-group date' id='dtp_default'>

 <input type="text" class="form-control" id="input_dtp_default" readonly />

 <span class="input-group-addon">

  <span class="glyphicon glyphicon-calendar"></span>

       </span>

</div>

Script Javascript

$('#dtp_default').datetimepicker({

     format : 'DD/MM/YYYY'

});

Jika script diatas kita jalankan pada browser pasti popup datetimepicker nya tidak muncul karena inputnya menggunakan atribut "readonly". Caranya agar bisa muncul kembali yaitu rubah script javascript menjadi seperti berikut : 

$('#dtp_default').datetimepicker({

     format : 'DD/MM/YYYY',

     ignoreReadonly: true

});

Dengan menambahkan "ignoreReadonly: true" maka datetimepicker akan muncul kembali. Silahkan jalankan kembali pada browser dan jika masih ada yang belum dipahami bisa tinggalkan komentar dibawah ya...