最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Bootstrap datepicker close function - Stack Overflow

programmeradmin2浏览0评论

I am trying to make function call on bootstrap datepicker when user clicks outside of calendar.

When user selects date datepicker closes automatically, same when user clicks outside of the datepicker div, it closes itself.

So my question is how can I understand when its closed? I know there is an event called onClose but it only works when page loads

fiddle

I am trying to make function call on bootstrap datepicker when user clicks outside of calendar.

When user selects date datepicker closes automatically, same when user clicks outside of the datepicker div, it closes itself.

So my question is how can I understand when its closed? I know there is an event called onClose but it only works when page loads

fiddle

Share Improve this question asked Sep 28, 2016 at 7:32 ShalafisterShalafister 3992 gold badges7 silver badges21 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 3

Use the .on("hide"... event.

From the docs:

$('.datepicker').datepicker()
    .on(picker_event, function(e) {
    // `e` here contains the extra attributes
});

For your example... picker_event will be hide.
Something like:

var checkin = $('#date-from').datepicker({
    format: 'dd/mm/yyyy',
    startDate: '+1d',
    weekStart: 1,
    beforeShowDay: function(date) {
    return date.valueOf() >= now.valueOf();
},
    autoclose: true
}).on('changeDate', function(ev) {
    alert("changed");
}).on('hide', function(ev) { // <-----------
    alert("hide");
});
  • Updated fiddle
  • bootstrap-datepicker events
  • bootstrap-datepicker hide event

As per the documentation here: https://bootstrap-datepicker.readthedocs.io/en/latest/events.html#hide

$('.datepicker').datepicker()
    .on('hide', function(e) {
        // `e` here contains the extra attributes
    });

Or

$('.datepicker').datepicker()
    .on('hide', myFunction);

And then create myFunction

function myFunction(e) {
    // whatever you want :)
}

Here is your example with little modify https://jsfiddle/mr3dxj5p/6/ here you can see I just change changeDate to hide to fire alert message

发布评论

评论列表(0)

  1. 暂无评论