How to get date, month, year in jQuery UI datepicker?

Question

I have this sample code:

<div id="calendar"></div>
$(document).ready(function()  {
    $('#calendar').datepicker({
      dateFormat: 'yy-m-d',
      inline: true,
      onSelect: function(dateText, inst) { 
            var month = dateText.getUTCMonth();
            var day = dateText.getUTCDate();
            var year = dateText.getUTCFullYear();
            alert(day+month+year);
     } 
    });
});

When I run the code, there is an error. How to get this (date, month, year)?

Might be similar to [this question](http://stackoverflow.com/questions/2562986/getdate-with-jquery-datepicker) — KevinIsNowOnline, Apr 24 '13 at 08:02

score 50 · Accepted Answer · answered Apr 24 '13 at 07:56

50

You can use method getDate():

$('#calendar').datepicker({
    dateFormat: 'yy-m-d',
    inline: true,
    onSelect: function(dateText, inst) { 
        var date = $(this).datepicker('getDate'),
            day  = date.getDate(),  
            month = date.getMonth() + 1,              
            year =  date.getFullYear();
        alert(day + '-' + month + '-' + year);
    }
});

FIDDLE

answered Apr 24 '13 at 07:56

Eli

14,779
5
59
77

1

why did you + 1 in date.getMonth() + 1? can you expalin? thanks – Francis Saul Mar 09 '16 at 07:03
1

month is 0..11, and need to be translated to 1..12 – Atara Mar 22 '16 at 13:53
Good work @Eli, I am searching this solution for last 15 minutes. It really helps me. But i have one confusion here day, month, year doesn't have a type. what't the type of that variables. – Ananda G Jun 19 '16 at 07:05

score 12 · Answer 2 · answered Apr 24 '13 at 07:59

12

Hi you can try viewing this jsFiddle.

I used this code:

var day = $(this).datepicker('getDate').getDate();  
var month = $(this).datepicker('getDate').getMonth();  
var year = $(this).datepicker('getDate').getYear();

I hope this helps.

answered Apr 24 '13 at 07:59

KevinIsNowOnline

773
4
10

5

Now in 2015 the `getYear()` method is deprecated. Use `getFullYear()` instead. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getYear – Daniel Muñoz Parsapoormoghadam Aug 31 '15 at 11:10

viclim · Answer 3 · 2013-04-24T08:03:42.223

5

Use the javascript Date object.

$(document).ready(function()  {
    $('#calendar').datepicker({
      dateFormat: 'yy-m-d',
      inline: true,
      onSelect: function(dateText, inst) { 
            var date = new Date(dateText);
            // change date.GetDay() to date.GetDate()
            alert(date.getDate() + date.getMonth() + date.getFullYear());
     } 
    });
});

edited Apr 24 '13 at 08:03

answered Apr 24 '13 at 07:58

viclim

959
8
16

score 0 · Answer 4 · answered May 10 '16 at 16:08

0

what about that simple way)

$(document).ready ->
 $('#datepicker').datepicker( dateFormat: 'yy-mm-dd',  onSelect: (dateStr) ->
    alert dateStr # yy-mm-dd
    #OR
    alert $("#datepicker").val(); # yy-mm-dd

answered May 10 '16 at 16:08

mix-fGt

447
5
10

score 0 · Answer 5 · answered Oct 31 '19 at 17:23

0

$("#date").datepicker('getDate').getMonth() + 1;

The month on the datepicker is 0 based (0-11), so add 1 to get the month as it appears in the date.

answered Oct 31 '19 at 17:23

Ben

1,853
19
20

How to get date, month, year in jQuery UI datepicker?

5 Answers5

Linked