CODEWITHSUNDEEP
javascriptdate
Greg
Greg

Reputation: 6613

adding day to a javascript date object does not work when moving to the next month

I'm having an issue when working with javascript date objects, specifically, when trying to add a day to a date object. The function I'm writing takes a start date and creates a list of the next seven days, used as the headers of a "week view" calendar app. When the week dates it's determining are within the same month, my function works as expected. When moving to the next month, things get wonky.

My date list generating function (NOTE: the .toHdr() method is a custom date method I've created, as is .clone()):

getWeekDates : function(date){                                  
    /*                                                          
     * Given a date object, returns a list of dates strings that
     * become the header of the week view                       
     */                                                         
    var _d = date.clone(), dates = [];                          
    for(var i=1; i<=7; i++){                                    
        dates.push(_d.toHdr());                                 
        _d.setDate(date.getDate() + i);                         
    }                                                                             
    return dates;                                               
}

When the date passed to this function is something like "Monday October 11th" (as a date object), the function above returns :

["Monday - Oct. 11, 2010", "Tuesday - Oct. 12, 2010", "Wednesday - Oct. 13, 2010", "Thursday - Oct. 14, 2010", "Friday - Oct. 15, 2010", "Saturday - Oct. 16, 2010", "Sunday - Oct. 17, 2010"]

However, when passed a date like "Sunday October 31st", the list that is returned looks like:

["Sunday - Oct. 31, 2010", "Monday - Nov. 1, 2010", "Friday - Dec. 3, 2010", "Monday - Jan. 3, 2011", "Friday - Feb. 4, 2011", "Tuesday - Mar. 8, 2011", "Wednesday - Apr. 6, 2011"]

Obviously adding one day to at a time to a date object become problematic when moving to another month, I'm just not exactly sure how to get around it. Any ideas?

EDIT:

Date.prototype.toHdr = function(){
    /*
     * Convenience method for creating a formatted string that will be used in
     * all headers with a specific date.
     */
    var dayMapping = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];
    var monthMapping = ['Jan.','Feb.','Mar.','Apr.','May','June','July','Aug.','Sept.','Oct.','Nov.','Dec.'];
    return dayMapping[this.getDay()] + ' - ' + monthMapping[this.getMonth()] + ' ' + this.getDate() + ', ' + this.getFullYear();

};

Date.prototype.clone = function(){
    /*
     * Clone a date object, useful for creating a copy of a date, so the
     * original isn't modified.
     */
    return new Date(this.getTime());
}

Upvotes: 3

Views: 3699

Answers (2)

sdespont
sdespont

Reputation: 14025

Old subject, but in case of someone reach this page, this little function could be useful.

To include the months management, you can create a new date using the "getTime()" function of the original date and adding the corresponding value of your number of days to add.

function addDays(date,addDays) {
    return new Date(date.getTime() + (addDays*24*60*60*1000));
}

Regards

Upvotes: 0

martin clayton
martin clayton

Reputation: 78105

Inside the loop you're using the supplied date as the reference point for every setDate():

_d.setDate(date.getDate() + i);

When date is the last day of October (31), and i is 1, this sets _d day-of-month to the 32nd - i.e. the 1st November. On the next iteration you set the day of month of _d to (31+2), but remember _d is now in November - so the date moves forward to 3rd December. In subsequent iterations your step size is increasing by an extra day each month, hence your result. Could you call the getter on _d instead? In that case instead of setting day-of-month to 32,33,34, etc. days, you would be setting to 32, then to 2, 3, and so on.

Upvotes: 3

Related Questions