jQuery DatePicker: Get Selected Date

Question

I need to be able to grab the selected date from the Datepicker and populate another textbox with the selected value. I am currently using the onClose function like this:

$('#defaultDate').datepicker({
    onClose:function(theDate) {
        $('#txtEntry1').text = theDate;
    }
});

Solution 1

There's an easier way to do it. Use the built-in alt-field option and you're done.

Populate an alternate field with its own date format whenever a date is selected using the altField and altFormat options. This feature could be used to present a human-friendly date for user selection, while passing a more computer-friendly date through for further processing.

Solution 2

Have you looked through the docs? http://docs.jquery.com/UI/Datepicker#events

onSelect function(dateText, inst)

Allows you to define your own event when the datepicker is selected. The function receives the selected date as text and the datepicker instance as parameters. this refers to the associated input field. Code examples

Supply a callback function to handle the onSelect event as an init option.

$('.selector').datepicker({
   onSelect: function(dateText, inst) { ... }
});

Comments

[Nathan Koop]

Please note: the alt-field option doesn't work for spans (probably other html elements as well)

[Matt Ball]

@NathanKoop well... yeah, a <span> is not a form field.

[Nathan Koop]

I didn't notice any qualifiers (I guess "field" should be somewhat of a clue) I just wanted to populate a span elsewhere on the form based on this input. Making a readonly textbox isn't really a great solution in this case.