Datepicker set date during page load

Question

I have a datepicker but it doesn't show date in the input when page is first time loaded. The date is set only after click.

$('#starts-on').datepicker({ 
            dateFormat: 'MM dd, yy' ,
        }).datepicker( "option", { setDate:"0",
                maxDate:'+3y -1d',
                minDate:'0' } );

How can the date be loaded during first time page loading? Moreover, i want to disable the text box to add text. Any help?

Answer 1

you could use setDate, like:

$(document).ready(function() {
    $('#starts-on').datepicker("setDate", your_Date_here);
});

Added:

$(document).ready(function() {
    $('#starts-on').datepicker({ 
            dateFormat: 'MM dd, yy' ,
        }).datepicker( "option", { setDate:"0",
                maxDate:'+3y -1d',
                minDate:'0' } );
    $('#starts-on').datepicker("setDate", "0"); //"0" for current date
});

Answer 2

You have to put the initialization object literal all in the first call of datepicker:

$( "#starts-on" ).datepicker({
    dateFormat: 'MM dd, yy' ,
    setDate:"0",
    maxDate:'+3y -1d',
    minDate:'0'
});

Setting an option for datepicker after initialization has a different syntax (see the example for dateformat here).