I am using Bootstrap datepicker in my web-application, but once I have selected date, date-picker is not hiding, how can I auto-hide date-picker once date is selected? Here is the date-picker Javascript code, which I am using
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker3.css" rel="stylesheet" />
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script>
$('.datepicker').datepicker({
format: 'mm/dd/yyyy'
});
Answered by:- vikas_jk
You can simply use "autoclose:true" property of bootstrap date picker, to close it after selection, here is an example
$('#datepicker').datepicker(
{
autoclose:true
}
);
OR
If you want to close it on date changed event call, you can do it as below
$('.datepicker').on('changeDate', function(event){
$(this).datepicker('hide');
});
Answered by:- pika
For bootstrap datepicker, you can auto-hide datepicker as below
$('#yourPickerId').datepicker({
format: 'dd/mm/yyyy',
}).on('changeDate', function(e){
$(this).datepicker('hide');
});Auto-hide datepicker for jQuery Datepicker, use the below code
$(".datepicker").datepicker({
format: "dd/mm/yyyy",
autoHide: true
})Thanks
Subscribe to our weekly Newsletter & Keep getting latest article/questions in your inbox weekly
Buy us a coffee
Become a Patron