2

I want to make a week planner, that displays all days of the week and the according date to it. And of course the month.

(Unfortunately, I don't have enough reputation to post a screenshot of what my calendar looks like.)

My JavaScript code looks like this. I found a part of it from Stack Overflow.

function calendar() {
    var today = new Date();
    var currYear = today.getFullYear();
    var currMonth = today.getMonth();
    var currWeek = today.getWeek()-1;

    var firstDateOfMonth = new Date(currYear, currMonth, 1);
    var firstDayOfMonth = firstDateOfMonth.getDay();    

    var firstDateOfWeek = new Date(firstDateOfMonth);

    firstDateOfWeek.setDate(
        firstDateOfWeek.getDate() +
        (firstDayOfMonth ? 7 - firstDayOfMonth : 0)
    );

    firstDateOfWeek.setDate(
        firstDateOfWeek.getDate() +
        7 * (currWeek-1)
    );


    var dateNumbersOfMonthOnWeek = [];
    var datesOfMonthOnWeek = [];

    for (var i = 0; i < 7; i++) {

        dateNumbersOfMonthOnWeek.push(
            firstDateOfWeek.getDate());

        datesOfMonthOnWeek.push(
            new Date(+firstDateOfWeek));

        firstDateOfWeek.setDate(
            firstDateOfWeek.getDate() + 1);

    }

    setText('month-year', monthArray[currMonth] + " " + currYear);

    setText('Mo', dateNumbersOfMonthOnWeek[0]);
    setText('Di', dateNumbersOfMonthOnWeek[1]);
    setText('Mi', dateNumbersOfMonthOnWeek[2]);
    setText('Do', dateNumbersOfMonthOnWeek[3]);
    setText('Fr', dateNumbersOfMonthOnWeek[4]);
    setText('Sa', dateNumbersOfMonthOnWeek[5]);
    setText('So', dateNumbersOfMonthOnWeek[6]);

};


function setText(id, val) {
    if(val < 10){
        val = '0' + val;
    }
    document.getElementById(id).innerHTML = val;

};


window.onload = calendar;

It works as it displays the correct days for the weekdays (so, 08 for this Monday, 09 for this Tuesdays, etc) and also the month is the correct one.

The question now is how to get the previous or next week? When I click on the "<" arrow I want to see the previous week. So how should I write the loop, which parameters does the method need, etc. I am very thankful for every hint, link, example etc.

halfer
  • 19,824
  • 17
  • 99
  • 186
  • You can upload your image on a image hosting site and post the link if you still want to show it. :) – kross Jun 12 '15 at 01:35
  • SO uploads the image to [imgur.com](http://imgur.com) for hosting anwya, so you could go upload it there and at least post a link to it (and maybe someone with enough rep to Edit will place it as an image for you). ;-) – Eric McCormick Jun 12 '15 at 01:36

1 Answers1

1

For next week-

var today = new Date();
var nextweek = new Date(today.getFullYear(), today.getMonth(), today.getDate()+7);

for more detail check following link:-

how to get next week date in javascript

Community
  • 1
  • 1
abhi312
  • 364
  • 1
  • 6
  • 25