DateRangePicker : Date Range Picker how to fire an event on entering a date

7

this section is the callback function:

function(start, end) {
    $('#dateRange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
}

you can add any code you want in this function to execute when a user selects a date. you could even define a callback function yourself and pass it to the daterange picker method.

example:

function myCallback(start, end) {
    $('#dateRange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
    alert('hello world'); //etc, your code here
}
// attach daterangepicker plugin
$('#dateRange').daterangepicker(options, myCallback);

you also could even define your own custom event handler and trigger it in the callback as well.

example

$(document).on('myCustomEvent', function () {
    // your code here
});

$('#dateRange').daterangepicker({
// .. //
function(start, end) {
    $('#dateRange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
    $(document).trigger('myCustomEvent');
});

shareimprove this answer

edited Jun 28 '16 at 21:51

shmosel

35.8k43891

answered Sep 1 '13 at 20:50

Neil S

2,0831425

• 1
  Thank you so much. That helped a lot! – Linda Keating Sep 1 '13 at 20:53
• I am using cakephp and same daterange picker for my project, how i can send start and end date to Controller using this myCustonevetnt? – Aryan Sep 30 '13 at 16:32 
• 1
  @Neil S, I am facing one issue when I don't change the default selected value in the daterangepicker, when clicking on apply button the callback function is not executed. Is there any solution to that. – tejashsoni111 May 14 '15 at 7:26

add a comment

10

From daterangepicker.com:

$('#daterange').on('apply.daterangepicker', function(ev, picker) {
    alert ('hello');
});

https://stackoverflow.com/questions/18562616/date-range-picker-how-to-fire-an-event-on-entering-a-date