JavaScript Calendar

2

I'm creating a JavaScript calendar. I want to show every month of the year. My problem is that the first month works fine, but the rest are not on the correct days. Step by parameter the number of each month that is in the array.

    function calendar(mois){

        var date = new Date();
        var day = date.getDate();
        var month = date.getMonth();
        var year = date.getYear();

        if(year<=200)
        {
                year += 1900;
        }
        months = new Array('Janvier', 'F&eacute;vrier', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Ao&ucirc;t', 'Septembre', 'Octobre', 'Novembre', 'D&eacute;cembre');
        days_in_month = new Array(31,28,31,30,31,30,31,31,30,31,30,31);

        var moisaujorduiu = month;

        month = mois;

        //ano bissesto, muda dia fevereiro
        if(year%4 == 0 && year!=1900)
        {
                days_in_month[1]=29;
        }


        total = days_in_month[month]; //days month

        var date_today = day+' '+months[month]+' '+year;//22 ouctober 2014

        beg_j = date; //today date

        beg_j.setDate(1);


        if(beg_j.getDate()==2) //1
        {
                beg_j=setDate(0);
        }
        beg_j = beg_j.getDay();

        document.write('<table class="cal_calendar"><tr><th colspan="7">'+months[mois]+' '+year+'</th></tr><br>');
        document.write('<tr class="cal_d_weeks"><th>Dim</th><th>Lun</th><th>Mar</th><th>Mer</th><th>Jeu</th><th>Ven</th><th>Sam</th></tr><tr>'); 
        week = 0;

        for(i=1;i<=beg_j;i++)
        {
                var beforemonth = months[month-1]; 

               document.write('<td><div class ="divday" />'+(days_in_month[month-1]-beg_j+i)+'</div></td>');
                week++;
        }
        for(i=1;i<=total;i++)
        {
                if(week==0)
                {
                    document.write("<tr>");
                }

                if(day==i && moisaujorduiu==month) //si le jour = le jour de aujordhui est si le mois = mois aujordui 
                {

                    document.write("<td><b><div class ='divtoday' onclick='open_popup(\""+i+" "+months[month]+"\")' href='#'>"+i+"</div><b></td>"); //day of today
                }
                //les autre jours
                else
                {

                    document.write("<td><div class ='divday' onclick='open_popup(\""+i+" "+months[month]+"\")' href='#'>"+i+"</div></td>");
                }
                week++;
                if(week==7)
                {
                        document.write('</tr>');
                        week=0;
                }
        }

            //pour les jour du prochain mois

             for(i=1;week!=0;i++)
            {
                    var nextmonth = months[month+1];
                    document.write('<td><div class ="divday">'+i+'</td>');
                    week++;
                    if(week==7)
                    {
                            document.write('</tr>');
                            week=0;
                    }
            }
        document.write('</table>'); 

Then I create a table, for every month in a cell and call the function with parameter.

<table border=0 width=100% height=100%>
        <tr>
            <td>
                    <script type="text/javascript">
                        var mois = 0; //janvier
                        calendar(mois);
                    </script>
            </td>
            <td>
                <script type="text/javascript">
                    var mois = 1; //fevrier
                calendar(mois);
                </script>
            </td>
            <td>
                <script type="text/javascript">
                    var mois = 2; //mars
                    calendar(mois);
                </script>
            </td>
            <td>
                <script type="text/javascript">
                    var mois = 3; //avril
                    calendar(mois);
                </script>
            </td>
        </tr>
        <tr>
            <td>    
                <script type="text/javascript">
                    var mois = 4; 
                    calendar(mois);
                </script>
            </td>
            <td>
                <script type="text/javascript">
                    var mois = 5; 
                    calendar(mois);
                </script>
            </td>
            <td>    
                <script type="text/javascript">
                    var mois = 6; 
                    calendar(mois);
                </script>
            </td>
            <td>    
                <script type="text/javascript">
                    var mois = 7; 
                    calendar(mois);
                </script>
            </td>
        </tr>
        <tr>
            <td>    
                <script type="text/javascript">
                    var mois = 8; 
                    calendar(mois);
                </script>
            </td>
            <td>    
                <script type="text/javascript">
                    var mois = 9; 
                    calendar(mois);
                </script>
            </td>
            <td>    
                <script type="text/javascript">
                    var mois = 10; 
                    calendar(mois);
                </script>
            </td>
            <td>    
                <script type="text/javascript">
                    var mois = 11; 
                    calendar(mois);
                </script>
            </td>
        </tr>   
    </table>
    
asked by anonymous 23.10.2014 / 19:54

1 answer

5

Hello, it's a simple problem. You are always assigning a day to the variable

beg_j = date; //today date
beg_j.setDate(1); //<--- passando um único dia 

Being that you must spend the total of days that you had summing up every month

I made the following adjustment:

if(month > 0) { 
    soma = 0;
    for(var m=0; m<month; m++) {
        soma += days_in_month[m];
    }
    beg_j.setDate(soma+1);
}
else {
    beg_j.setDate(1);
}

Test and see if it works. I hope I have helped

Follow the updated JavaScript function:

function calendar(mois){

    var date = new Date();
    var day = date.getDate();
    var month = date.getMonth();
    var year = date.getYear();

    if(year<=200)
    {
            year += 1900;
    }
    months = new Array('Janvier', 'F&eacute;vrier', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Ao&ucirc;t', 'Septembre', 'Octobre', 'Novembre', 'D&eacute;cembre');
    days_in_month = new Array(31,28,31,30,31,30,31,31,30,31,30,31);

    var moisaujorduiu = month;

    month = mois;

    //ano bissesto, muda dia fevereiro
    if(year%4 == 0 && year!=1900)
    {
            days_in_month[1]=29;
    }


    total = days_in_month[month]; //days month

    var date_today = day+' '+months[month]+' '+year;//22 ouctober 2014

    beg_j = date; //today date

    if(month > 0) { 
        soma = 0;
        for(var m=0; m<month; m++) {
            soma += days_in_month[m];
        }
        beg_j.setDate(soma+1);
    }
    else {
        beg_j.setDate(1);
    }


    if(beg_j.getDate()==2) //1
    {
            beg_j=setDate(0);
    }
    beg_j = beg_j.getDay();

    document.write('<table class="cal_calendar"><tr><th colspan="7">'+months[mois]+' '+year+'</th></tr><br>');
    document.write('<tr class="cal_d_weeks"><th>Dim</th><th>Lun</th><th>Mar</th><th>Mer</th><th>Jeu</th><th>Ven</th><th>Sam</th></tr><tr>'); 
    week = 0;

    for(i=1;i<=beg_j;i++)
    {
            var beforemonth = months[month-1]; 

           document.write('<td><div class ="divday" />'+(days_in_month[month-1]-beg_j+i)+'</div></td>');
            week++;
    }
    for(i=1;i<=total;i++)
    {
            if(week==0)
            {
                document.write("<tr>");
            }

            if(day==i && moisaujorduiu==month) //si le jour = le jour de aujordhui est si le mois = mois aujordui 
            {

                document.write("<td><b><div class ='divtoday' onclick='open_popup(\""+i+" "+months[month]+"\")' href='#'>"+i+"</div><b></td>"); //day of today
            }
            //les autre jours
            else
            {

                document.write("<td><div class ='divday' onclick='open_popup(\""+i+" "+months[month]+"\")' href='#'>"+i+"</div></td>");
            }
            week++;
            if(week==7)
            {
                    document.write('</tr>');
                    week=0;
            }
    }

        //pour les jour du prochain mois

         for(i=1;week!=0;i++)
        {
                var nextmonth = months[month+1];
                document.write('<td><div class ="divday">'+i+'</td>');
                week++;
                if(week==7)
                {
                        document.write('</tr>');
                        week=0;
                }
        }
    document.write('</table>');
}
    
23.10.2014 / 20:16