I am trying to write a function that returns an array of dates from today till the maximum date, so that I can restrict the date picker selection. At the moment I have the following:-
datesAfterToday: function (date) {
var dates = []
var currentDate = new Date()
var endDate = new Date(8640000000000000).getFullYear()
var addDays = function (days) {
var date = new Date(this.valueOf())
date.setDate(date.getDate() + days)
return date
}
while (currentDate <= endDate) {
dates.push(currentDate)
currentDate = addDays.call(currentDate, 1)
}
return dates
}
and then I am using Vue.js to mount it as follows :-
mounted () {
this.allowedDates = this.datesAfterToday
},
however I am only getting an array of objects instead of the proper array.
How can I get the proper array of dates so that I can bind it to the allowdates property.
Thanks for your help and time!
For starters new Date(8640000000000000).getFullYear() will set endDate to the year of that date, which is 275760. currentDate will be today's date (in milliseconds), which at the time of me writing is 1511272934156. As you can see currentDate is always greater than endDate, so your while loop never goes to the statements inside.
Another issue is that the date you picked is really far in the future and you're populating an array one day at a time. Your loop will most likely make the page freeze or crash completely. Try picking a date that's more manageable.
For instance, in the snippet below I set endDate by first initializing it to today, then setting the year to exactly one year from now. This gives me an array with roughly 365 values.
You can imagine how big this array would be if I used a year that was 273,748 years in the future.
var dates = []
var currentDate = new Date()
var endDate = new Date()
endDate.setFullYear(endDate.getFullYear()+1)
var addDays = function (days) {
var date = new Date(this.valueOf())
date.setDate(date.getDate() + days)
return date
}
while (currentDate <= endDate) {
dates.push(currentDate)
currentDate = addDays.call(currentDate, 1)
}
console.log(dates)
With all that being said, it looks like you're actually allowed to pass an object specifying the minimum and maximum values rather than an array.
https://vuetifyjs.com/components/pickers#example-6
let d = new Date() // today
let d2 = new Date()
d2.setFullYear(date.getFullYear()+1) // Next year
this.allowedDays = {
min : d.toISOString().substr(0, 10), // e.g. 2017-11-21
max : d2.toISOString().substr(0, 10)
}
Another option would be to use vuejs-datepicker For example:
<script>
var state = {
disabled: {
to: new Date(), // Disable all dates up to specific date
from: new Date(8640000000000000) // Disable all dates after specific date
}
}
</script>
<datepicker :disabled="state.disabled"></datepicker>
See Disabled Dates in the documentation.
Related
const today = new Date()
const tomorrow = new Date(today)
const newDate = tomorrow.setDate(tomorrow.getDate() + 2)
console.log(newDate.toLocaleDateString('en-us'))
I'm trying to get next 2 days date with mm/dd/yyyy format, but getting issues.
I tried with following code:
console.log(new Date().toLocaleDateString('en-US'));
Example: today's date >> 6/1/2022
Expected result : 6/3/2022
Your problem comes from the fact, .setDate does not return a Date Object, but instead modifies the Date Object you call it on.
This means, tomorrow will be modified by calling .setDate.
Just change your code to the following, to get the expected result:
const today = new Date()
const tomorrow = new Date(today)
tomorrow.setDate(tomorrow.getDate() + 2)
console.log("today:", today.toLocaleDateString('en-US'))
console.log("in two days:", tomorrow.toLocaleDateString('en-us'))
Trying out a Jquery to confirm if date selected is equal to today or greater than.
If i select today, it return it as the day selected is less than today. Selecting previous day works well but selecting today returns less than. Any tip.
var firstRepaymentDate = new Date($('#First_Repayment_Date').val());
var today = new Date();
if (firstRepaymentDate.getTime() < today.getTime()) {
alert('The First Repayment Date Can only Be Today Or Future Date');
return false;
}
Don't forget that new Date() will include the current time as well. You'll need to remove that time component with today.setHours(0,0,0,0) for the comparison to be correct.
Also, setHours() returns the underlying value like getTime() so you can do
var firstRepaymentDate = new Date($('#First_Repayment_Date').val());
var today = new Date();
if (firstRepaymentDate.getTime() < today.setHours(0,0,0,0)) {
alert('The First Repayment Date Can only Be Today Or Future Date');
return false;
}
In response to the comment about adding 20 days:
This is a little more detailed but is fairly easy.
var today = new Date();
var plus20Days = new Date(today.setDate(today.getDate() + 20));
again you can then use setHours() to reset the time component.
new Date() considers time too, not only the date. I think the easiest way to achieve this is to compare years, months and days by using respectively getFullYear() , getMonth() , getDate().
Check all the methods that manipulate js Date here
https://developer.mozilla.org/it/docs/Web/JavaScript/Reference/Global_Objects/Date
I m trying to do the following :
Storing Current day +1 (Tomorrow's date) ( CurrentDay is the StartDay,wrong naming alias,my bad)
calculating 7 days from date from 1st Step
Everyday checking presentDay, and if is equal to 7th day, run my logic.
Problem I m facing is :
The DateObject I store is in a numerical format and it also saves the time. I want only the date for comparison.
Is it possible to directly compare dates? I do not really wish to use 3rd party library.
Any help will be appreciated.
Code :
var d = new Date();
var stdate = d.setDate(d.getDate() + 1); //output something like 1526407850028 ( last few digits changes every second)
var weeklyDate = new Date();
var wkdate = weeklyDate.setDate(weeklyDate.getDate() + 7); //output Ex : 1526926307437
var presentDay = new Date();
var pdate = presentDay.setDate(presentDay.getDate());
if (pdate == wkdate) { // I want only date comparison
// my logic
}
Try keeping your steps more separate. For instance, why not just compare the date values by calling Date.prototype.getDay()? Then you're not working with all of that other stuff. You can also reduce the number of calls to new Date(), so the whole thing would be:
//calculate target date
let d = new Date(); // returns an integer between 0-6
var stDay = (d.getDay()+1)%7; //tomorrow's day of week kept between 0-6 by modulus
//daily check runs in separate function
let today = new Date();
if( today.getDay() === stDay){
//logic
}
developer.mozilla.org - Date.prototype.getDay()
Based on this Supplied Code,
$w.onReady(function () {
//TODO: write your page related code here...
const startFromDays = 4;
const endAtMonths = 9;
const today = new Date();
let startDate = new Date(today);
let endDate = new Date(today);
startDate.setDate(startDate.getDate() + startFromDays);
endDate.setMonth(endDate.getMonth() + endAtMonths);
$w.onReady(function () {
$w("#datePicker1").minDate = startDate;
$w("#datePicker2").maxDate = endDate;
});
});
I need help to find the difference between the endDate and the startDate and output it as Text. Knowing the fact that some start dates can be of the Eg: 26th of Feb and end Date can fall on 3rd March.
This Code is been run on Wixcode, where the dates are used as a Date-picker user input. Thank you.
Start by getting the difference between the two dates using something like what is described in this post.
Then, use that number to populate a text field that you've added to your page.
So, assuming you have a datediff() function declared:
const diff = datediff(startDate, endDate);
$w("#text1").text = diff.toString();
I'm trying to get the current date without the time and store it in a variable, within JavaScript. It needs to be without time as I'm converting it to an epoch date, with which I will use to measure the past 24 hours (if date is within 24 hours then it will be displayed). The problem is that with the added time, it doesn't match as within the last 24 hours.
e.g. it returns the date as the following when converted to epoch: 1408704590485
I want it to be like 1408662000000
I'm not to sure how to do this.
Code - How the current days epoch date is currently being stored -
var epochLoggingFrom;
var epochLoggingTo;
$(document).ready(function () {
epochLoggingFrom = dateToEpoch(new Date());
epochLoggingTo = dateToEpoch(new Date());
}
dateToEpoch function -
function dateToEpoch(thedate) {
return thedate.getTime();
}
Try this:
function dateToEpoch(thedate) {
var time = thedate.getTime();
return time - (time % 86400000);
}
or this:
function dateToEpoch2(thedate) {
return thedate.setHours(0,0,0,0);
}
Example : http://jsfiddle.net/chns490n/1/
Reference: (Number) Date.prototype.setHours(hour, min, sec, millisec)
Try this:
var nowDate = new Date();
var date = nowDate.getFullYear()+'/'+(nowDate.getMonth()+1)+'/'+nowDate.getDate();
Note: Adjust format as you want, like reorder day, month, year, remove '/' and get combined date etc.
or use this:
dateToEpoch(new Date().toLocaleDateString())
I tried using javascript. this method returns the current date in "DD/MM/YYYY" format.
getCurrentDate() {
const t = new Date();
const date = ('0' + t.getDate()).slice(-2);
const month = ('0' + (t.getMonth() + 1)).slice(-2);
const year = t.getFullYear();
return `${date}/${month}/${year}`;
}