Javascript Date selector

Question

I need the user to select his/her date of birth and I'm using javascript & php.

    var date_arr = new Array;
var days_arr = new Array;

date_arr[0]=new Option("January",31);
date_arr[1]=new Option("February",28);
date_arr[2]=new Option("March",31);
date_arr[3]=new Option("April",30);
date_arr[4]=new Option("May",31);
date_arr[5]=new Option("June",30);
date_arr[6]=new Option("July",31);
date_arr[7]=new Option("August",30);
date_arr[8]=new Option("September",30);
date_arr[9]=new Option("October",31);
date_arr[10]=new Option("November",31);
date_arr[11]=new Option("December",30);

function fill_select(f)
{
        document.writeln("<SELECT name=\"months\"               onchange=\"update_days(FRM)\">");
        for(x=0;x<12;x++)
                document.writeln("<OPTION value=\""+date_arr[x].value+"\">"+date_arr[x].text);
        document.writeln("</SELECT><SELECT name=\"days\"></SELECT>");
        selection=f.months[f.months.selectedIndex].value;
}

function update_days(f)
{
        temp=f.days.selectedIndex;
        for(x=days_arr.length;x>0;x--)
        {
                days_arr[x]=null;
                f.days.options[x]=null;
         }
        selection=parseInt(f.months[f.months.selectedIndex].value);
        ret_val = 0;
        if(f.months[f.months.selectedIndex].value == 28)
        {
                year=parseInt(f.years.options[f.years.selectedIndex].value);
                if (year % 4 != 0 || year % 100 == 0 ) ret_val=0;
                else
                        if (year % 400 == 0)  ret_val=1;
                        else
                                ret_val=1;
        }
        selection = selection + ret_val;
        for(x=1;x < selection+1;x++)

        {
                days_arr[x-1]=new Option(x);
                f.days.options[x-1]=days_arr[x-1];
        }
        if (temp == -1) f.days.options[0].selected=true;
        else
             f.days.options[temp].selected=true;
}
function year_install(f)
{
        document.writeln("<SELECT name=\"years\" onchange=\"update_days(FRM)\">")
        for(x=1950;x<2005;x++) document.writeln("<OPTION value=\""+x+"\">"+x);
        document.writeln("</SELECT>");
        update_days(f)
}

This is the generating code:

<script>fill_select(document.frmProfile);year_install(document.frmProfile)</script>

The problem is when its submitted to the database the day and year are sent according to selection but the month displays the total num of days in that month instead of the month itself.

Eg:-- If i want to select february 20 1996 I want to get an output 1996-02-20 to enter into db. Using this code I get an output as 1996-28-20 I know the problem is in this function

function fill_select(f)
    {
            document.writeln("<SELECT name=\"months\"               onchange=\"update_days(FRM)\">");
            for(x=0;x<12;x++)
                    document.writeln("<OPTION value=\""+date_arr[x].value+"\">"+date_arr[x].text);
            document.writeln("</SELECT><SELECT name=\"days\"></SELECT>");
            selection=f.months[f.months.selectedIndex].value;
    }

But I just don't know what exactly I should change

Answer 1

You might want to safe yourself from the hassle of calculating the leap years and all, and use the jQuery UI datepicker instead.

Because the value of the options are used when you hit 'submit', you do not want the month values to contain their number of days (28, 30, 31), but their actual number instead (1-12).

So change

for(x=0;x<12;x++)
    document.writeln("<OPTION value=\""+date_arr[x].value+"\">"+date_arr[x].text);

...into...

for(x=0;x<12;x++)
    document.writeln("<OPTION value=\""+(x+1)+"\">"+date_arr[x].text);

Now we cannot rely on these values anymore to determine how many days are in a month, but we can use the date_arr for that. So change:

selection=parseInt(f.months[f.months.selectedIndex].value);
ret_val = 0;
if(f.months[f.months.selectedIndex].value == 28)
{ // (...)

... into...

selection=parseInt(date_arr[f.months.selectedIndex].value);
ret_val = 0;
if(selection == 28)
{ // (...)

Now it should work better. Good luck.