Set today's date as default date in jQuery UI datepicker

JqueryJquery UiJquery Ui-Datepicker

Jquery Problem Overview


I just want today's date to be the default value in the input that is using jQuery UI's datepicker:

<input id="mydate" type="text" />

I tried the below code but it didn't work:

var currentDate = new Date();  
$("#mydate").datepicker("setDate",currentDate);

Jquery Solutions


Solution 1 - Jquery

You need to make the call to setDate separately from the initialization call. So to create the datepicker and set the date in one go:

$("#mydate").datepicker().datepicker("setDate", new Date());

Why it is like this I do not know. If anyone did, that would be interesting information.

Solution 2 - Jquery

You have to initialize the datepicker before calling a datepicker method.

$("#mydate").datepicker().datepicker("setDate", new Date());
//-initialization--^          ^-- method invokation

<link href="https://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<input type="text" id="mydate" />


Here is a Working JSFiddle.

P.S: This assumes that you have the correct date set in your computer

Solution 3 - Jquery

Its very simple you just add this script,

$("#mydate").datepicker({ dateFormat: "yy-mm-dd"}).datepicker("setDate", new Date());

Here, setDate set today date & dateFormat define which format you want set or show.

Hope its simple script work..

Solution 4 - Jquery

$("#date").datepicker.regional[""].dateFormat = 'dd/mm/yy';
$("#date").datepicker("setDate", new Date());

Always work for me

Solution 5 - Jquery

This one work for me , first you bind datepicker to text-box and in next line set (today as default date) the date to it

$("#date").datepicker();

$("#date").datepicker("setDate", new Date());

Solution 6 - Jquery

Note: When you pass setDate, you are calling a method which assumes the datepicker has already been initialized on that object.

$(function() {    
   $('#date').datepicker();
   $('#date').datepicker('setDate', '04/23/2014');
});

Test: http://jsfiddle.net/wimarbueno/hQkec/1/

Solution 7 - Jquery

Set default date in initialization:

$("#date").datepicker({
    defaultDate: '01/26/2014'
});

Solution 8 - Jquery

This worked for me and also localised it:

$.datepicker.setDefaults( $.datepicker.regional[ "fr" ] );
$(function() {
   $( "#txtDespatchDate" ).datepicker( );
   $( "#txtDespatchDate" ).datepicker( "option", "dateFormat", "dd/mm/yy" );
   $('#txtDespatchDate').datepicker('setDate', new Date());
});

Solution 9 - Jquery

Just set minDate: 0

Here is my script:

$("#valid_from")
   .datepicker({
     minDate: 0,
     defaultDate: "+1w",
     changeMonth: true,
     numberOfMonths: 3
})

Solution 10 - Jquery

I tried many ways and came up with my own solution which works absolutely as required.

"mydate" is the ID of input or datepicker element/control.

        $(document).ready(function () {

        var dateNewFormat, onlyDate, today = new Date();

        dateNewFormat = today.getFullYear() + '-' + (today.getMonth() + 1);

        onlyDate = today.getDate();

        if (onlyDate.toString().length == 2) {
            dateNewFormat += '-' + onlyDate;
        }
        else {
            dateNewFormat += '-0' + onlyDate;
        }
        $('#mydate').val(dateNewFormat);
    });

Solution 11 - Jquery

You have not defined

$("#mydate").datepicker({});

Solution 12 - Jquery

Try this:

$('.datepicker').datepicker('update', new Date(year,month,day));

Solution 13 - Jquery

try this:

$("#mydate").datepicker("setDate",'1d');

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionChris AbramsView Question on Stackoverflow
Solution 1 - JqueryMartin EdenView Answer on Stackoverflow
Solution 2 - JqueryT JView Answer on Stackoverflow
Solution 3 - JqueryrjonyView Answer on Stackoverflow
Solution 4 - JqueryAshisha NautiyalView Answer on Stackoverflow
Solution 5 - JqueryUsman YounasView Answer on Stackoverflow
Solution 6 - JqueryWilzonView Answer on Stackoverflow
Solution 7 - JqueryMorten HolmgaardView Answer on Stackoverflow
Solution 8 - JqueryJanView Answer on Stackoverflow
Solution 9 - JqueryMike NguyenView Answer on Stackoverflow
Solution 10 - JqueryRadha Anil KView Answer on Stackoverflow
Solution 11 - JqueryAshish MehtaView Answer on Stackoverflow
Solution 12 - JqueryAbdo BahhousView Answer on Stackoverflow
Solution 13 - JqueryEthan MoreView Answer on Stackoverflow