Trigger change event on DatePickerInput

[openHBP]

I would like to catch the change event of a DatePickerInput. The classical jQuery $("#id_inputdate").change(function(){console.log('YESSS'}); does not work. I've checked and try https://stackoverflow.com/questions/6471959/jquery-datepicker-onchange-event-issue without any success. Would you please tell me how to do it??? Please note that I'm also using the linked range date feature with .start_of and end_of. Many thanks for this great widget anyway! It works fine and it is very nice.

[monim67]

The event is dp.change. Try $("#id_inputdate").on("dp.change", function(){...}). See all available events.

[openHBP]

Thanks for your quick answer! I just tried but it is not working... I've no error in my Chromium Console? I've done the same on a simple text field and it works, so I'm sure to be working on the right js file. And my page is well refreshed after a click on CTRL+F5. Would you please try it on your side? I'm with django 2.2 with python 3.6, django-bootstrap4==0.0.8 and jQuery-3.3.1

[monim67]

Check the id of the generated input element in your HTML source, use that id to bind event.

[openHBP]

Please find attached a printscreen of the concerned part of my HTML page. Maybe it will give you a clue? When a user change the inputdate (Date), I want to be able to adapt the date below (à recevoir au plus tard le) at the same date than then inputdate.

[monim67]

It should work, is your code on github? Have you tried printing something to console in the event handler?

[openHBP]

My code is on framagit. Do you have a login there, so that I can share it with you? Printing to the console is the only thing I do, like that: $("#id_inputdate").on("dp.change", function() {console.log("OK")} );

[monim67]

Does printing in the console work? It it works then you have to do the following.

$("#id_inputdate").on("dp.change", function(event) {
    $("#id_of_your_second_input_field").data("DateTimePicker").date(event.date);
});

[openHBP]

Unfortunately it does'nt. To help, I've created a very simple project "datepick_djproj" on GitHub with a simple form with 2 dates and the jQuery code to catch the change event. I've just invite you to collaborate on this Public project: https://github.com/openHBP/datepick_djproj/invitations.

[monim67]

Check your source code, you are loading jQuery twice, that is causing the problem.

[openHBP]

I've removed the call to jQuery in my index.html file at line 15. Yet the change event isn't triggered. Sorry to insist but I've already tried a lot of date pickers (flatpickr, gijgo, Tempus Dominus Bootstrap 4, XDSoft DateTimePicker and Fengyuan Chen’s) and yours is my favourite.

[monim67]

The event is dp.change, not dp_1.change.

[openHBP]

Magic, it works! I've put dp_1 during my tests because the dp_config id was dp_1 MANY, MANY thanks! Have a nice week-end!