Date shift in JavaScript
Date shift in JavaScript can be done by counting days of the month and thinking of 28 or 29 days in February. Don't forget the year. This is a long and complicated algorithm. I suggest a simpler solution. Transform date to the number of milliseconds, and make easy arithmetic with integers. After addition and subtraction, create date from the milliseconds.
| << | < | > | >> |
In this example, shifDate is called on the onClick event with parameter -1 and 1 for the day shift, and -7 and 7 for the week shift. With a few lines of JavaScript, date can be shifted easily.
// shift date function
// input parameter can be positive or negative and represents the number of days to shift
function shiftDate(shift){
// set reference to the element containing date
var txtDate = document.getElementById('txtDate');
// extract month, day and year from the txtDate string (date format is mm/dd/yyyy)
var mm = txtDate.innerHTML.substring(0,2);
var dd = txtDate.innerHTML.substring(3,5);
var yyyy = txtDate.innerHTML.substring(6,10);
// convert txtDate to the miliseconds (mm-1 because months start with 0)
mSeconds = (new Date(yyyy, mm-1, dd)).getTime();
// initialize date object
objDate = new Date();
// set shifted date (86400000 is the number of miliseconds in one day)
objDate.setTime(mSeconds + 86400000*shift);
// get month, day and year from shifted date (reuse mm, dd and yyyy variables)
mm = objDate.getMonth()+1;
dd = objDate.getDate();
yyyy = objDate.getFullYear();
// set leading zero if needed
if (mm < 10) mm = "0" + mm;
if (dd < 10) dd = "0" + dd;
// write back shifted date to the HTML element
txtDate.innerHTML = mm + '/' + dd + '/' + yyyy;
}
Just for a note, current date is displayed using another JavaScript code. I had to use client side logic, because this is a classic WordPress post.
Related posts
- JavaScript date validation
- JavaScript Drag and Drop example 4
- JavaScript Drag and Drop example 3
- JavaScript Drag and Drop example 2
- Maintain vertical scroll position
Follow me on Twitter