Trigger jQueryUI datePicker on button click, send result to disabled input field

Question

Hi
I've been searching for a way to do this, but could not find anything

I want to have a:

• a disabled input text field, called #XX. This input will store the selected value from datepicker (as this input is disabled I won't be able to use this to trigger the datePicker)

• A button, besides #XX. When user clicks this button, datePicker will show. User will select the date, and this date will be assigned to disabled input #XX.

I want this so user can't change manually -by typing crap- the selected date

Also, should I validate if date was entered using #XX.val()? or is there a better way?

Thanks

Answer 1

You can show a datepicker that has been previously attached to an input element using the "show" method.

$('#myButton').click(function ()
{
    $('#myField').datepicker("show");
});

Answer 2

<script type="text/javascript">
    $(function () {
        $("#datepicker").datepicker({
            constrainInput: true,
            showOn: 'button',
            buttonText: 'Select...'
        });
    });
</script>
<input id="datepicker" disabled="disabled" />

This will add a button next to the input field, and disable the user from entering text into the field...