How to get the changed date from bootstrap-datepicker

Question

I am using Eternicode's fork of the bootstrap-datepicker library and until now all is going well for generating it, but I want to get the date in order to use it in my logic after changing the date.

$('#calendar').on('changeDate', function(event, date) {
  // how to pop alert message to print the date I've chosen ?
});

How can I do this?

Solution

As described in the docs, the Eternicode version of bootstrap-datepicker adds three attributes to the changeDate event that can be used for accessing the newly selected date. You'll be interested in either the .date property (which points to the actual date object representing the selected date) or the .format method, which you can use to get the date as a string.

Assuming the simplest case (where you have a single picker and you want to get the date as a string in the same format that you initialised the datepicker with), you'll just want to call .format() with no arguments:

$('#calendar').on('changeDate', function(event) {
    alert(event.format());
});

Here's a JSFiddle showing this in action: http://jsfiddle.net/bhm7p/3/

Comments

[Admin]

Actually your fiddle contains different code. It calls .datepicker() before .on() - this is essential.

[Mark Amery]

@buffjape well, sure - if you don't call .datepicker() at some point in the code, then you don't have a datepicker. But note that the .datepicker() call just returns the jQuery collection it was called on for chaining, not any kind of special datepicker object - so you don't need to call .on() specifically on the result of the .datepicker() call, you just need to have called .datepicker somewhere in your code. See jsfiddle.net/bhm7p/33 for an illustration of this.