jquery date picker but day month and year in separate dropdowns

Question

I am working on a jquery date picker. I need to select a date but after date selection from the calendar I need the date to divide into three separate drop downs. One for d

Answer 1

Working demo please click here : ] http://jsfiddle.net/gvAbv/13/ or http://jsfiddle.net/gvAbv/8/

In demo click on the text box and select dates and bingo you will get the drop downs auto populated.

Point to note dateText.split('/')[2] is year not day :) if you will switch over the place your code will work.

i.e. dateText.split('/')[2] : year ; dateText.split('/')[0] : month ; dateText.split('/')[0] : day rest demo will help you to make it clear.

The demo has extra bits but it will help you!

code

$(function() {
    $("#fullDate").datepicker({
        onClose: function(dateText, inst) {
            $('#year').val(dateText.split('/')[2]);
            $('#month').val(dateText.split('/')[0]);
            $('#day').val(dateText.split('/')[1]);
        }
    });
});

ANother Demo for image click: http://jsfiddle.net/zwwY7/

code

$(function() {
    $("#fullDate").datepicker({
         buttonImage: 'icon_star.jpg',
        buttonImageOnly: true,
        onClose: function(dateText, inst) {
            $('#year').val(dateText.split('/')[2]);
            $('#month').val(dateText.split('/')[0]);
            $('#day').val(dateText.split('/')[1]);
        }
    });
});

​

Images

Answer 2

Use the datepicker onselect method to get the date values you need :: onselect info

Like:

onSelect: function(dateText, inst) {            
        var datePieces = dateText.split('/');
        var month = datePieces[0];
        var day = datePieces[1];
        var year = datePieces[2];
        //define select option values for
        //corresponding element
        $('select#month').val(month);
        $('select#day').val(day);
        $('select#year').val(year);

}

Did you mean something like that