get 24 hours date and time for loop in javascript - javascript

I have one drop-down(values are "Last 24 hours", "Last 48 hours", etc like) when I select "Last 24 hours" in the drop-down
i need all dates from now to yesterday with one hour intervals.
i tried this,
var todayDate = new Date();
if(type=="hours"){ // for hours based drop-down
var oneDayAgo = new Date(todayDate.getTime());
oneDayAgo.setDate(todayDate.getDate() - 1);
console.log("oneDayAgo"+oneDayAgo);
var hours = todayDate.getHours();
for(var i = hours; i <= hours+24; i++) {
if(i<25){
var newHours=i;
var newDates=todayDate.getFullYear() + "-" + ("00" + (todayDate.getMonth() + 1)).slice(-2) + "-" + ("00" + todayDate.getDate()).slice(-2) + " " + ("00" +newHours).slice(-2) + ":" + ("00" + todayDate.getMinutes()).slice(-2) + ":" + ("00" + todayDate.getSeconds()).slice(-2);
console.log(newDates);
}else{
var newHours=i-24;
var newDates=oneDayAgo.getFullYear() + "-" + ("00" + (oneDayAgo.getMonth() + 1)).slice(-2) + "-" + ("00" + oneDayAgo.getDate()).slice(-2) + " " + ("00" +newHours).slice(-2) + ":" + ("00" + oneDayAgo.getMinutes()).slice(-2) + ":" + ("00" + oneDayAgo.getSeconds()).slice(-2);
console.log(newDates);
}
}
}
my expected output is ,
for example current date and time is 2014-04-27 13:07 means,
output like 2014-04-27 13:07, 2014-04-27 12:07, 2014-04-27 11:07 , 2014-04-27 10:07.... 2014-04-26 13:07
please help on this. thanks

function getDateItems(hours) {
var toDate = new Date();
var fromDate = new Date();
fromDate.setTime(fromDate.getTime() - (hours * 60 * 60 * 1000));
var result = [];
while (toDate >= fromDate) {
result.push(toDate.getFullYear() + "-" + ("00" + (toDate.getMonth() + 1)).slice(-2) + "-" + ("00" + toDate.getDate()).slice(-2) + " " + ("00" + toDate.getHours()).slice(-2) + ":" + ("00" + toDate.getMinutes()).slice(-2) + ":" + ("00" + toDate.getSeconds()).slice(-2));
// consider using moment.js library to format date
toDate.setTime(toDate.getTime() - (1 * 60 * 60 * 1000));
}
return result;
}
var datesFrom24Hours = getDateItems(24);
var datesFrom48Hours = getDateItems(48);
console.log(datesFrom24Hours);

Here a working sample, which might be what you want.
//get type and hoursOption from dropdowns
var type = 'hours'
var hoursOption = 48;
var todayDate = new Date();
if(type=="hours"){ // for hours based drop-down
var hours = todayDate.getHours();
for(var i = hours; i <= hours + hoursOption; i++) {
todayDate.setHours(todayDate.getHours() - 1)
var newDates = todayDate.getFullYear() + "-" + ("00" + (todayDate.getMonth() + 1)).slice(-2) + "-" + ("00" + todayDate.getDate()).slice(-2) + " " + ("00" + todayDate.getHours()).slice(-2) + ":" + ("00" + todayDate.getMinutes()).slice(-2) + ":" + ("00" + todayDate.getSeconds()).slice(-2);
console.log(newDates);
}
}
For for-loop variable hours I added hourOption which comes from dropdown options, eg. 24, 48, 72, etc.
Inside loop you take todayDate and just add one hour less then before, so it will show hours counting backwards.

This worked for me
const start = new Date("2022-01-01T00:00:00");
const end = new Date("2022-01-01T23:00:00");
for (let current = start; current <= end; current.setHours(current.getHours() + 1)) {
console.log(current);
}

Related

Why this code got an Uncaught TypeError

I want to get next day and format it into "yyyy-MM-dd HH:mm" format, but when I run this in chrome's console, I got an Uncaught TypeError: date.getHours is not a function, why? The nextDay variable is clearly an instance of Date.
But when I removed hour and minute, just kept year, month and date, it successed, can anyone tell me the reason?
var time = new Date().getTime();
var interval = 24 * 60 * 60 * 1000;
var nextDay = new Date(time + interval);
function padding(number) {
return number < 10 ? "0" + number : "" + number;
}
function format(date) {
var year = date.getFullYear(),
month = date.getMonth(),
date = date.getDate(),
hour = date.getHours(),
minute = date.getMinutes();
return padding(year) + "-"
+ padding(month + 1) + "-"
+ padding(date) + " "
+ padding(hour) + ":"
+ padding(minute);
}
console.log(format(nextDay));
Your function takes a parameter named "date" and then tries to declare a local variable named "date". That declaration will be ignored, and the initializer will just overwrite the value of the parameter.
Change the name of the parameter:
function format(d) {
var year = d.getFullYear(),
month = d.getMonth(),
date = d.getDate(),
hour = d.getHours(),
minute = d.getMinutes();
return padding(year) + "-"
+ padding(month + 1) + "-"
+ padding(date) + " "
+ padding(hour) + ":"
+ padding(minute);
}
You are using the same variable name as the parameter, date is used twice, change the variable name like down below.
var time = new Date().getTime();
var interval = 24 * 60 * 60 * 1000;
var nextDay = new Date(time + interval);
function padding(number) {
return number < 10 ? "0" + number : "" + number;
}
function format(date) {
var year = date.getFullYear(),
month = date.getMonth(),
theDate = date.getDate(), //change the variable name
hour = date.getHours(),
minute = date.getMinutes();
return padding(year) + "-"
+ padding(month + 1) + "-"
+ padding(date) + " "
+ padding(hour) + ":"
+ padding(minute);
}
console.log(format(nextDay));

compare two times in format 'hh:mm tt' in javascript not work in safari

I want to compare two times
compareTwoTime('06:10 PM', '07:10 PM',false)
function compareTwoTime(startTime, stopTime, moreAndEqual) {
var t = new Date();
d = t.getDate();
m = t.getMonth() + 1;
y = t.getFullYear();
//Convert time into date object
var d1 = new Date(m + " " + d + " " + y + " " + startTime);
var d2 = new Date(m + " " + d + " " + y + " " + stopTime);
//Get timestamp
var t1 = d1.getTime();
var t2 = d2.getTime();
if (moreAndEqual)
return t1 >= t2;
else
return t1 < t2;
}
in chrome it work ok, but in safari
`new Date(m + " " + d + " " + y + " " + startTime); is NaN`
some proposal?
Dates are always tricky. If you can afford it and you do a lot of date manipulations in your app, I would simply use moment.js.
Otherwise, you could do some string manipulation and put the AM/PM to the front of string, and then compare the two lexicographically.

Get dates of next 8 Saturdays (javascript)

I was able to get date of closest Saturday - CodePen
Need help with finding dates of the next seven saturdays.
Thank you
function myFunction(x){
var now = new Date();
now.setDate(now.getDate() + (x+(7-now.getDay())) % 7);
document.getElementById("1s").innerHTML = now.getDate() + ' of ' + now.getMonth() + 'th';
}
Just add 7 days to the date you got and loop desired number of weeks ahead.
function myFunction(x){
var now = new Date();
now.setDate(now.getDate() + (x+(7-now.getDay())) % 7);
document.getElementById("1s").innerHTML = now.getDate() + ' of ' + now.getMonth() + 'th';
var newDate = now;
for (var i = 2; i <= 8; i++) {
var numberOfDaysToAdd = 7;
newDate.setDate(newDate.getDate() + numberOfDaysToAdd);
document.getElementById("" + i + "s").innerHTML = newDate.getDate() + ' of ' + newDate.getMonth() + 'th';
}
}
Forked codepen

Javascript: two buttons set two timestamp

I have a form, with two text input (two timestamp) as follows:
TimeStamp start []
TimeStamp end []
Both TimeStamps are to be filled automatically with two buttons:
[Set Start] and [Set End], that read the local timestamp in the form (24h):
2013-06-27 23:55
TimeStamp start is when the operator start filling the form, while
TimeStamp end is when the form ends to be filled (the delay between these events can be also of 1 hour)
The data are then processed by POST to a script PHP
How I can handle this timestamp settings on the client side (JS, JQuery?)
Thanks in advance
#manraj82
I found this JS function to get timestamp with JS
function getTimeStamp() {
var now = new Date();
return ((now.getMonth() + 1) + '/' + (now.getDate()) + '/' + now.getFullYear() + "
" + now.getHours() + ':' + ((now.getMinutes() < 10) ? ("0" + now.getMinutes()) :
(now.getMinutes())) + ':' + ((now.getSeconds() < 10) ? ("0" + now.getSeconds()) :
(now.getSeconds())));
}
Now I have to associate it to two buttons
I didnt quite undesrtand what your question was but try this.This might not be the answer but will give you an idea
Date.prototype.addHours= function(h){
var newDateTime = new Date(this);
newDateTime.setHours(newDateTime.getHours() + h);
return newDateTime;
}
function getTimeStamp(dt) {
return (
(dt.getMonth() + 1) + '/' +
(dt.getDate()) + '/' + dt.getFullYear() +
" " +
dt.getHours() + ':' +
((dt.getMinutes() < 10) ? ("0" + dt.getMinutes()) : (dt.getMinutes())) + ':' +
((dt.getSeconds() < 10) ? ("0" + dt.getSeconds()) : (dt.getSeconds())));
}
var startDateTime = new Date(),
addHours = 10,
endDateTime = startDateTime.addHours(addHours);
console.log(getTimeStamp(startDateTime));
console.log(getTimeStamp(endDateTime));

Date/Time format issue with Chrome

I get the date/time value as below in JSON:
"ChangedDate":"\/Date(1349469145000)\/"
In FF and IE, I get the above date in 12 hr format (10/5/2012 - 3:32:25 PM) using the helper function below:
Handlebars.registerHelper('FormatDate', function (date) {
if (date == null)
return "";
else {
var value = new Date(parseInt(date.substr(6)));
return value.getMonth() + 1 + "/" + value.getDate() + "/" + value.getFullYear() + " - " + value.toLocaleTimeString();
}
});
however, in Chrome I still get the 24 hr format (10/5/2012 - 15:32:25).
How do I get the date/time value in 12 hr format in Chrome?
Use toLocaleTimeString when the intent is to display to the user a
string formatted using the regional format chosen by the user. Be
aware that this method, due to its nature, behaves differently
depending on the operating system and on the user's settings.
You may be better off changing this line:
return value.getMonth() + 1 + "/" + value.getDate() + "/" + value.getFullYear() + " - " + value.toLocaleTimeString();
to:
return value.getMonth() + 1 + "/" + value.getDate() + "/" + value.getFullYear() + " - " + (value.getHours() > 12 ? value.getHours() - 12 : value.getHours()) + ":" + value.getMinutes() + ":" + value.getSeconds();
Where we check to see if the hours are > 12 and if so we subtract 12 from that number.
(value.getHours() > 12 ? value.getHours() - 12 : value.getHours())
So your example 15:32:25 would be 15 - 12 = 3: 3:32:25.
https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Date/getSeconds
https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Date/getMinutes
https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Date/getHours
EDIT
//set up example
var date = new Date("10/5/2012");
date.setHours(15,32,25,00);
//Get data from date
var month = date.getMonth()+1;
var day = date.getDate();
var year = date.getFullYear();
var hours = date.getHours();
var amOrPm = "AM";
if(date.getHours() > 12){
hours = date.getHours() - 12;
amOrPm = "PM";
}
var minutes = date.getMinutes();
if(minutes < 10)
minutes = "0" + minutes;
var seconds = date.getSeconds();
if(seconds < 10)
seconds = "0" + seconds;
var dateString = month + "/" + day + "/" + year + " - " + hours + ":" + minutes + ":" + seconds;
console.log(dateString);
I made this example a bit more detailed than needed, but it helps to show you what's going on. Hope it helps.
EXAMPLE
Condensed down this would look something like:
//Get data from date
var dateString = (date.getMonth()+1) + "/" + date.getDate() + "/" + date.getFullYear() + " - " + (date.getHours() > 12 ? date.getHours() - 12 : date.getHours())+ ":" + (date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes()) + ":" + (date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds()) + " " + (date.getHours() > 12 ? "PM" : "AM");
EXAMPLE

Categories

Resources