How to set current date with jquery ui datepicker

Question

I'm making an edit profile form, and I'm using jquery iu datepicker to select DOB, now when user edits its data he/she has already some date in the profile field, now if the user wanted to change the date the datepicker pops up, how can I make the date from profile field to be selected on the date picker,

or simply how can I make datepicker display specific date when opened here is my current script:

$('#member_dob').datepicker({
            changeMonth: true,
            changeYear: true,
            defaultDate: ,
            yearRange: '1970:1992',
            dateFormat: 'yy-mm-dd',
            monthNamesShort: ['Jan','Feb','Mar','Apr','Maj','Jun','Jul','Aug','Sep','Okt','Nov','Dec'],
            dayNamesMin: ['Ned', 'Pon', 'Uto', 'Sri', '&#268;et', 'Pet', 'Sub']
        });

So for instance if my dob is 20.05.1987 , how could I set datepicker to display that date when opened, or just month and a year

Sinan · Accepted Answer · 2010-02-13 20:35:29Z

7

You can assign a date object to default date setting to datepicker widget, for instance as default date 1980, February 2nd:

var d = new Date(1980, 2, 2);
$('#member_dob').datepicker({
            changeMonth: true,
            changeYear: true,
            defaultDate: d,
            yearRange: '1970:1992',
            dateFormat: 'yy-mm-dd',
            monthNamesShort: ['Jan','Feb','Mar','Apr','Maj','Jun','Jul','Aug','Sep','Okt','Nov','Dec'],
            dayNamesMin: ['Ned', 'Pon', 'Uto', 'Sri', '&#268;et', 'Pet', 'Sub']
        });

This should do what you need,

hope it helps, Sinan.

answered Feb 13, 2010 at 20:35

Sinan

11.5k7 gold badges39 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

VinnyG · Accepted Answer · 2013-09-19 15:20:55Z

4

If you want to change an existing datepicker value you can do this :

$('#txtDate').datepicker().datepicker('setDate', 'today');

answered Sep 19, 2013 at 15:20

VinnyG

6,9117 gold badges60 silver badges77 bronze badges

1 Comment

Maciej Pyszyński Over a year ago

If the date picker already exist then $('#txtDate').datepicker('setDate', 'today'); is enough

Donny Kurnia · Accepted Answer · 2010-02-13 20:31:06Z

3

You can put the default date into the input field:

<input name="date" id="member_dob" value="87-05-20" />

DatePicker will automatically selected that date when opened. Make sure the value match with dateFormat that you're using.

answered Feb 13, 2010 at 20:31

Donny Kurnia

5,3035 gold badges38 silver badges53 bronze badges

Comments

Mike P. · Accepted Answer · 2010-02-13 20:35:33Z

Im not sure if I get right what you try to accomplish here. First of all you need to pass the current DOB from the serverside to Javascript.

You can do that in two ways. One is to build a jsonObject, for example:

var jsonDate = {date : '1987-05-20'};

And then in your datepicker:

$('#member_dob').datepicker({
            changeMonth: true,
            changeYear: true,
            defaultDate: jsonDate.date,
            yearRange: '1970:1992',
            dateFormat: 'yy-mm-dd',
            monthNamesShort: ['Jan','Feb','Mar','Apr','Maj','Jun','Jul','Aug','Sep','Okt','Nov','Dec'],
            dayNamesMin: ['Ned', 'Pon', 'Uto', 'Sri', '&#268;et', 'Pet', 'Sub']
});

The second is to set a value for the Input you trigger you datePicker on :

$('#member_dob').datepicker({
            changeMonth: true,
            changeYear: true,
            yearRange: '1970:1992',
            dateFormat: 'yy-mm-dd',
            monthNamesShort: ['Jan','Feb','Mar','Apr','Maj','Jun','Jul','Aug','Sep','Okt','Nov','Dec'],
            dayNamesMin: ['Ned', 'Pon', 'Uto', 'Sri', '&#268;et', 'Pet', 'Sub']
   });

<input type="text" id="member_dob" value="1987-05-20">

Oskar · Accepted Answer · 2014-01-06 14:58:27Z

1

This works for me:

$(function() {
      $( "#datepicker" ).datepicker({
          changeMonth: true,
          changeYear: true,
          firstDay: 1,
          showAnim: 'slideDown',
          dateFormat: 'yy-mm-dd',
        });
      $("#datepicker").datepicker("setDate", new Date());
     });

answered Jan 6, 2014 at 14:58

Oskar

2,57234 silver badges37 bronze badges

Collectives™ on Stack Overflow

How to set current date with jquery ui datepicker

5 Answers 5

Comments

1 Comment

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related