I'm looking to add 5 days to the date however because I need a date as dd mmm yy the date has to be a string. The string part works great but as soon as I add anything to the new date value it then doesn't increment the month. Adding any later infers the number as a string.
Thanks
monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun",
"Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
const dateObj = new Date();
const month = monthNames[dateObj.getMonth()];
const day = String(dateObj.getDate()).padStart(2, '0');
const year = dateObj.getFullYear();
const output = + day +'\n'+ month + '\n' + year;
document.write(output)
You can use setDate() to add days to your date. Then you can use toLocaleDateString() to format your date.
const addDays = (days) => {
const date = new Date();
date.setDate(date.getDate() + days);
return date.toLocaleDateString(undefined, {
day: '2-digit',
month: 'short',
year: 'numeric'
});
}
console.log(addDays(5));
.as-console-wrapper { max-height: 100% !important; top: 0; }
Related
I would like to request assistance on how can I block a specific dates on my date selector.
Specific dates are:
December 24, 25, 30, 31 - 2020 and January 1, 2021 ONLY.
Note: We need to remain the current function where the selected available dates are 2 days advanced from today. Weekends are also blocked. This functions are already in the script
<style>
select {
font-family:Arial, Helvetica, sans-serif;
font-size:14px; color:#000;
}
</style>
<select name="APPOINTMENTDATE" id="date-range" data-field-type="Text">
<option value="" selected="selected">Select date</option>
</select>
<script>
var dateRange = document.getElementById('date-range'),
monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
for(var day = 2; day < 30; day++) {
var date = new Date();
date.setDate(date.getDate() + day);
if(!(date.getDay()==6|| date.getDay()==0))
dateRange.options[dateRange.options.length] = new Option([monthNames[date.getMonth()], date.getDate(), date.getFullYear()].join(' '));
}
</script>
You can do something like this.
var dateRange = document.getElementById('date-range'),
monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
for (var day = 2; day < 30; day++) {
var date = new Date();
date.setDate(date.getDate() + day);
if (!(date.getDay() == 6 || date.getDay() == 0)) {
dateRange.options[dateRange.options.length] = new Option(
[monthNames[date.getMonth()],
date.getDate(),
date.getFullYear()
].join(' '));
}
}
//define dates to be blocked.
var arr = ["Dec 24 2020", "Dec 25 2020", "Dec 30 2020", "Dec 31 2020", "Jan 01 2021"];
//loop through dateRange.options
for (var i = 1; i < dateRange.options.length; i++) {
//when date to be blocked found, mark it as disabled
arr.includes(dateRange.options[i].value) ? dateRange.options[i].disabled = true : dateRange.options[i].disabled = false;
}
My function displays the current date along with the next 60 days however I want the current date to be highlighted. What would be the best approach?
var date = new Date();
var dayInt = date.getDate();
var month = date.getMonth();
var year = date.getFullYear();
var dateRange = document.getElementById('calendar-table-range');
var monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
document.getElementById("month").innerHTML = monthNames[month];
document.getElementById("year").innerHTML = year;
for(var day = 0; day < 60; day++) {
var date = new Date();
date.setDate(date.getDate() + day);
var cell = document.createElement("li");
var cellText = document.createTextNode(day);
var date = ('0' + date.getDate()).slice(-2) + ' '
+ monthNames[date.getMonth()] + ' '
// + date.getFullYear();
cell.innerHTML = date;
dateRange.appendChild(cell);
}
Since you're always showing the next 60 days, the current date is always the first date in the list, so it's easy to target with a CSS selector. For example:
#calendar-table-range li:first-child {
background-color: yellow;
}
Another way to go about it is to create a timestamp in the same format as the dates in the range then search for it.
E.g. the following, which puts formatting into a separate function and removes code that wasn't being used:
function formatDate(d){
let monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
return ('0 ' + d.getDate()).slice(-2) + ' '
+ monthNames[d.getMonth()];
}
function highlightToday() {
let today = formatDate(new Date());
let cells = document.querySelectorAll('#calendar-table-range > li');
for (var i=0, iLen=cells.length; i<iLen; i++) {
if (cells[i].textContent == today) {
cells[i].style.color = 'red';
return;
}
}
}
var date = new Date();
var dayInt = date.getDate();
var month = date.getMonth();
var year = date.getFullYear();
var dateRange = document.getElementById('calendar-table-range');
var monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
document.getElementById("month").innerHTML = monthNames[month];
document.getElementById("year").innerHTML = year;
for(var day = 0; day < 6; day++) {
var date = new Date();
date.setDate(date.getDate() + day);
var cell = document.createElement("li");
var date = formatDate(date);
cell.innerHTML = date;
dateRange.appendChild(cell);
}
<div id="month"></div>
<div id="year"></div>
<input type="button" onclick="highlightToday()" value="highlight today">
<ol id="calendar-table-range">
</ol>
I'm getting a date string "Wed Mar 19 00:30:00 IST 1997" and I want to make this as readable YYYY-MM-DD format. Is there any solution to do this with pure javascript?
It seems that your time is not normal javascript date string. if you remove the IST from your string, you can create a date object from it.
dateString = 'Wed Mar 19 00:30:00 IST 1997';
var date = new Date(dateString.replace('IST', ''));
let day = date.getDate();
let month = date.getMonth()+1;
let year = date.getFullYear();
console.log(year+"/"+month+"/"+day)
You can try using the following function
let str = "Wed Mar 19 00:30:00 IST 1997"
function formatDate(date) {
date = date.split(" ");
let monthsList = [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec"
];
let year = date[5];
let month = `0${(monthsList.indexOf(date[1]) + 1)}`.slice(-2);
let day = date[2];
return `${year}-${month}-${day}`;
}
console.log(formatDate(str));
you can try this.
let date = new Date();
let day = date.getDate();
let month = date.getMonth()+1;
let year = date.getFullYear();
console.log(year+"/"+month+"/"+day)
How to get month and year data in Nodejs and query to insert into database?
var months = ["jan", "feb", "mar", "apr", "may", "jun", "july", "aug", "sep", "oct", "nov", "dec"];
var date = new Date();
var month = date.getMonth(); // returns 0 - 11
var year = date.getFullYear();
console.log(months[month]);
console.log(year);
To get the current month and year you can do the following
var date= new Date();
var month = date.getUTCMonth() + 1; //months from 1-12
var year = date.getUTCFullYear();
However i cannot answer on how to save to Database since that depends entirely on the Database and Object Modelling you are using. Can you provide more info on the Database please.
Thanks.
How to format the javascript Date object the way stackoverflow does it.
For example. Aug 23 '10 at 23:35
This is what I tried.
new Date(val.replace(' ','T')+'Z').toString().split('GMT')[0]
This works cross browser. But doesn't look neat.
function formatDate(date) {
var monthNames = [
"Jan", "Feb", "Mar",
"Apr", "May", "Jun", "Jul",
"Aug", "Sep", "Oct",
"Nov", "Dec"
];
var day = date.getDate();
var monthIndex = date.getMonth();
var month = monthNames[monthIndex];
var year = date.getFullYear().toString().substring(2,3);
var hours = date.getHours();
var minutes = date.getMinutes();
return month+' '+day+" '"+year+' at '+hours+':'+minutes;
}
Try this:
var date = new Date();
var formattedDate =
(date.toLocaleString("en-us", { month: "long" })) + " " +
date.getDate() + " '" + (date.getFullYear() % 100);
var formattedTime = date.getHours() + ':' + date.getMinutes();
alert( formattedDate + " at " + formattedTime );
Here's a JSFiddle.