Compare two different dates in React - reactjs

I am new to react and I try to validate a form. To do validation I want to compare two dates. So I get today date and add seven days to today date.
const date = new Date();
date.setDate(date.getDate() + 7);
Then I try to compare this date with the input field date.
if (values.expiryDate<=date) {
errors.expiryDate = "Expiry date should not be longer than a week.";
}
I try to compare two dates like this. But this code does not validate these two days. How do I solve this issue?

If the values.expiryDate is in string then first convert it to Date object.
const d1 = new Date(values.expiryDate);
then you can compare d1 and date easily.
if (d1<=date) {
errors.expiryDate = "Expiry date should not be longer than a week.";
}

Related

Is it possible to call a function after a specifc time?

For example is it possible to call a function after 2 weeks?
I thought about react and a library like dayjs and some code like this:
const date = Number(dayjs(new Date()).format("DD"))
if (date === date + 14) {
//function
}
I testet it with seconds and realised that i am dumb because everytime i refresh the page it will restart the "timer". Do you have any ideas if it is possible?
As suggested in the comments, you could make a cookie/session storage item containing the date at which you want this to take place. Here is an example using session storage, though a cookie is more preferable:
const nowInTwoWeeks = new Date(Date.now()) // Today's date
nowInTwoWeeks.setDate(nowInTwoWeeks.getDate() + 14) // Add 14 days
sessionStorage.setItem('twoWeeksMark', nowInTwoWeeks)
const now = new Date(Date.now()) // Today's date to use for comparison
if (now >= sessionStorage.getItem('twoWeeksMark')) {
// Do the work
}

How to filter month by string query

I have a SQL like this in my apex code:
public static list<FB_Employees__c> getRecords() {
return [
SELECT Name, Date_of_birth__c
FROM FB_Employees__c
WHERE CALENDAR_MONTH(Date_of_birth__c) = 7
];
}
It will filter all the users who have birthday on July, by doing this way, I will have to change the code every month and I think I should have a another way to do it automatically, I think of a way using string query but I'm not still familiar with it? Can anyone suggest me an idea to improve the code?
Change it to look like this:
WHERE Date_of_birth__c = THIS_MONTH
THIS_MONTH allows us to easily compare to the current month.
You just want to filter those employees whose birthdays are in the present month ?
First get the month as an integer from the present date.
Then insert this value in your query using single quotes ('....') around your month value and treating the whole query as a single string.
public static list<FB_Employees__c> getRecords()
{
int thisMonth = Calendar.getInstance().get(Calendar.MONTH) + 1; // Since Java month range is 0..11
return [
"SELECT Name, Date_of_birth__c
FROM FB_Employees__c
WHERE CALENDAR_MONTH(Date_of_birth__c) = '" + thisMonth + "';"
];
}
Use CALENDAR_MONTH(Date_of_birth__c) = THIS_MONTH, this will automatically compare DOB with current month
Date class has a perfect method for your case: month()
Returns the month component of a Date (1=Jan).
So your APEX method should be:
public static list<FB_Employees__c> getRecords() {
Integer thisMonth = System.today().month();
return [
SELECT Name, Date_of_birth__c
FROM FB_Employees__c
WHERE CALENDAR_MONTH(Date_of_birth__c) = :thisMonth
];
}

How to check if a string is a date value / date string in react

I want to check if a string value is a date or not.
I have used different ways to recognize , but all of them recognize "111" (and some other string like this) as date.
Actually, I have different string that user entered them like: text, number, IP address, date, range, date time , etc. I saved all of them as string (because I have to save them as string in my project)
Now, in other section of my project, I want to check if a string is date (with this format 2020-09-23 00:00:00), show that different and convert it to date with moment.
I used this ways:
1-
moment(myString, "YYYY-MM-DD HH:mm:ss").isValid()
2-
Date.parse(myString)
but all of them return true for string "111" or "1234" and so on.
I want to my condition return true if and only if mySting has YYYY-MM-DD HH:mm:ss format like this: 2020-09-23 00:00:00
Why don't you try parsing the string into date? so something like new Date(dateString) that will either spit out a date object or a string saying date is invalid. In your case you should try this const isDateValid = (date = "") => { let parsedDate = new Date(date); return parsedDate.toString() !== "Invalid Date"; } That should do the trick.

SetDate() behaves weirdly in datepicker modal

I have a day picker in a datepicker modal I am writing in React with hooks. I want to display today's date in the middle and count backwards going up and forwards going down from today. I also need my dates to wrap to the next or previous month and start or end on the correct number of days. My html looks like this
<div className={'dateField'} ref={dayRef}>
<div>{getDayNumber(-3)}</div>
<div>{getDayNumber(-2)}</div>
<div>{getDayNumber(-1)}</div>
{/* TODAY */}
<div>{date.getDate()}</div>
{/* END TODAY */}
<div>{getDayNumber(1)}</div>
<div>{getDayNumber(2)}</div>
<div>{getDayNumber(3)}</div>
</div>
I have a getDayNumber function, but it behaves very strangely. It will count backwards, but not forwards, and sets today's date minus 1 as the same as today's date. I think this is because it is somehow switching to a 0 index count of days? How do I change this back into the day number?
const getDayNumber = (dayNumber) => {
var newDate = new Date(date.setDate(date.getDate() - dayNumber));
console.log('NEW DATE NUMBER!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!', newDate.getDate());
return newDate.getDate();
};
I also have an issue where passing different numbers into getDayNumber() doesn't work - I think this is because I am resetting the central date object with setDate()?:
const [ date, setMyDate ] = useState(new Date());
I think setting the getDayNumber function to create a new Date first gets rid of the problem:
const getDayNumber = (dayNumber) => {
var newDate = new Date();
newDate.setDate(date.getDate() - dayNumber);
console.log('NEW DATE NUMBER!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!', newDate.getDate());
return newDate.getDate();
};

Add and display days/months/years to date input by user in Angularjs

I am unable to work out how to display a date which is one or more days/months/years in the future from that being input by the user.
For example:
<input ng-model="startDate" type="date" id="start-date" name="startDate">
Which is to be displayed below:
<p>The start and end dates are: {{startDate | date}} and {{endDate() | date}}.</p>
The endDate function is as follows:
$scope.endDate = function() {
if($scope.startDate) {
var endDate = $scope.startDate;
return endDate.setYear(endDate.getYear() + 1);
}
}
Whilst the startDate displays, the endDate() does not. This happens whether or not I wrap it in the if statement.
I'd strongly suggest using the moment.js library for any AngularJS related date maths. Very easy addition and subtraction etc functions for date objects.
http://momentjs.com/
Example
$scope.date = moment().add(1, 'months') will add a month to the current date.

Resources