Customize the date returned by getDate() method

Question

I am using jQuery datepicker plugin. I should get the date value displayed when the user selects a date from the calender. I use getDate() method as given in the documentation. However, I wan't the output to be in a different format then what I am getting right now. You ll understand when you see the code.

JavaScript

 $("#dealpickerEnd").datepicker({
    inline: true,
    showOtherMonths: true,
    firstDay: 1,
    dayNamesMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
    onSelect: function() {
        var deal = document.getElementById("dealDateAfter");
        var currentDate = $("#dealpickerEnd").datepicker("getDate");
        deal.innerHTML = currentDate;
    }
 });

Output

Fri Dec 26 2014 00:00:00 GMT+0530 (IST)

Intended Output

26-Dec-2014

Is this possible?

I got the answer from the other thread. Thanks for the proper redirection. — Thomas Sebastian, Dec 18 '14 at 10:42

Jai · Answer 1 · 2014-12-18T11:03:14.250

There is a workaround for it, declare an array filled with short names of Months and then you can get the date object in the onSelect and do as below:

var monthNamesMin = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
$("#dealpickerEnd").datepicker({
    inline: true,
    showOtherMonths: true,
    firstDay: 1,
    dayNamesMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
    onSelect: function () {
        var deal = document.getElementById("dealDateAfter");
        var date = $(this).datepicker('getDate'),
            day = date.getDate(),
            month = monthNamesMin[date.getMonth()], // <---pick the month name.
            year = date.getFullYear();
        var datetoput = day + '-' + month + '-' + year;
        deal.innerHTML = datetoput;
    }
});

Demo

Customize the date returned by getDate() method

1 Answers1