How to append the selected date to a hidden input using jquery ui datepicker?


When using the jquery ui datepicker, I'd like to append the date the user selects to a hidden input field so that I can pass the value upon form submission.  Any assistance you could provide would be much appreciated.

Here's my fiddle which shows my current working code:

Just not sure how to modify the javascript to grab the date once it is selected?

Who is Participating?
leakim971Connect With a Mentor PluritechnicianCommented:
also hide your calendar container with CSS else we need to click twice on the button the first time :
Robert SchuttConnect With a Mentor Software EngineerCommented:
use onSelect to add a callback function:
            $("#calendar").datepicker({autoSize:true, onSelect:function(selectedDate, objDatePicker){
                $('#stoppage_date').val($('#stoppage_date').val() + ',' + selectedDate);

Open in new window

updated fiddle:
(note that I used a TEMP visible input to more easily check that it works)
MurfurFull Stack DeveloperCommented:
Daft question for you: why have a hidden field and not just capture the date selected from the date field on form submission?
evibesmusicAuthor Commented:

Thank you very much for the assistance. Much appreciated.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.