Search code examples
javascriptjquerytwitter-bootstrapdatebootstrap-datepicker

How to hide the Bootstrap datepicker

I made the date field readonly but still we are able to select the date from datepicker. I tried 

$('#date').datepicker("None");
$('#date').datepicker("disable");
$('#date').datepicker("destroy");

None of them works. But the below code worked partially. Like on click it is showing the calendar and getting hidden. I'm not able to select any date from the calendar. This is fine but even it should not show the calendar.

$('#date').on('click', function(){
    $('.datepicker').hide();
});
Solution

  • If the #date is readonly, why initialize the datepicker? The following code should be enough: $('#date').attr('readonly', true)

    EDITED to include the following solution to remove datepicker once it was initialized: $('#date').datepicker('remove');