Validating a date field in a calendar - javascript

I want to validate a date field calendar, where dates in the calendar cannot be selected to greater than today. The below code is in the tips of the eval field like "
set a variable called 'return' to true to stop this date from being selected.
var diff = new Date().compare(new Date(date));
var result = diff < 0 ? true : false;
Now I want the same intended result that is the dates in the calendar cannot be selected greater than today.

var result = new Date() < new Date(date);

Expanding on Darin Dimitrov's answer with Pawan's response.
inputField.onchange = function(){
return (new Date() < new Date(this.value))? true: this.value = "";
}

Related

Default date range with lightpicker.js and moment.js

How can I get the following codepen to default to showing all the data. I currently defaults to 21/11/2019 - 28/11/2019. If I change the range to 01/11/2019 - 30/11/2019 it shows all the data. I'm using lightpicker.js and moment.js. Thank you.
UPDATE: What I'm trying to do is show all the data with nothing in the Date Range. Just page defaulting to show everything with no filters. Then I should be able to filter if I choose dates in the Date Range. When I comment out the line picker.setDateRange(new Date(), moment().add(7, 'day')); It show blank text box for the Date Range but no data is shown.
JS
var picker = new Lightpick({
field: document.getElementById('datepickerA'),
singleDate: false
});
picker.setDateRange(new Date(), moment().add(7, 'day'));
$scope.onOkA = function(){
var startDate = picker.getStartDate().format('MM/DD/YYYY')
var endDate = picker.getEndDate().format('MM/DD/YYYY')
if(startDate && endDate){
$scope.filteredTicketA = $scope.ticketsA.filter(ele=>{
return (new Date(ele.Date)-new Date(startDate)>=0) && (new Date(ele.Date)-new Date(endDate)<=0)
})
}
}
new Date() will default to today, if you want it be 01/11/2019 then use new Date(2019,11-1, 1).
However I would use some constants to make code clearer, replace picker.setDateRange() sentence with these 3 lines:
var startDate = new Date(2019,11-1, 1); // be aware that month is 0 based.
var endDate = moment(startDate).endOf('month');
picker.setDateRange(startDate, endDate);
as a quick solution for onOKA(){} I would change this:
var defaultStartDate = moment(new Date(1, 10, 2019));
var startDate = (pickerB.getStartDate() || defaultStartDate).format('MM/DD/YYYY');

why are the dates not being generated properly?

I am using a function in Angular JS to generate the dates for the past one week starting from today's date. I am storing these dates in an array and then using that array to flood a dropdown.
The following is the code that is being used by me.
generate() {
this.date_new = [];
var date = new Date();
var date1 = new Date();
for (var i = 0; i < 7; i++) {
date.setDate(date1.getDate() - i);
var a = date.toString();
var str = this.convert(a);
this.date_new.push(str);
}
}
Here convert is a function which is being used to convert the dates to the required format. A screenshot of generated dates is attached below.
As evident from the screenshot, the last two dates are incorrect. Can somebody explain to me, what the problem is?
The setDate() method sets the day of the Date object relative to the
beginning of the currently set month.
The above is from MDN.
Your code works for the first 5 dates, but once you are modifying your February date with -1, it sets the day relative to the current month e.g. February. So this will turn into January (as you are setting the day to -1), same happens in the next iteration and you get December.
For an easy fix you can just set the date variable to new Date() in the first line of your for loop.
The issue here is using the same date variable in the loop. You need to re-initialize it.
As can be seen in Parameters Value section in the link here. Zero and negative values in setDate() sets the date from previous month.
Hence at setDate(0), date value is set to last day of Feb. Now since you are using the same variable, setDate(-1) takes the previous month from Feb hence you get Jan.
You need to change the code to something like this:
generate() {
this.date_new = [];
var date1 = new Date();
for (var i = 0; i < 7; i++) {
// re-initialize date
var date = new Date();
date.setDate(date1.getDate() - i);
var a = date.toString();
var str = this.convert(a);
this.date_new.push(str);
}
}
Hope this helps :)
The issue here is that negative numbers inside the setDate method don't work quite well.
Please update the code to something like below:
this.date_new = [];
var date = new Date();
var date1 = new Date();
for (var i = 0; i < 7; i++) {
date= new Date(date1.getFullYear(), date1.getMonth(),date1.getDate()-i);
var a = date.toString();
var str = this.convert(a);
this.date_new.push(str);
}
Hope this will solve your problem.

How to put basic date validations in mirth javascript

We currently accept HL7 data through mirth and one of the field we process is date of birth, which we receive in PID.7.1 segment of HL7. Currently we just capture it like -
var vDOB = formatDate(msg['PID.7.1'].toString(),"yyyyMMdd");
How can I validate day , month and year component in the date. And also like it should be greater than today's date.
Thanks
You can include a function like this:
var dateChecker = function(dateStr){
if(date.length !=8 && !date.match('[0-9]{8}')) return false;//should be number and length 8
var year = date.substr(0,4);
var month = date.substr(4,2);
var day = date.substr(6,2);
var dateObj = new Date(year,month,day);
if (dateObj == 'Invalid Date') return false;
if(dateObj.getTime() - Date.now() > 0) return false;//compare epoch to check if date is less than current date/time
return true;
}
and then dateChecker(vDOB) should return true/false depending on whether the date is valid or invalid.

javascript date validation is not working for today date

I have got below java script code that will validates date range ... when the user entered the today date or any future dates I have set IsValid to true and then will do the save operation ....
for that purpose I have written below code ..
function Save(e) {
var popupNotification = $("#popupNotification").data("kendoNotification");
var container = e.container;
var model = e.model;
var isValid = true;
var compareDate = e.model.DeliveryDate;
alert(compareDate);
var todayDate = new Date();
var compareDateModified = new Date(compareDate)
alert(compareDateModified);
if (compareDateModified > todayDate || compareDateModified === todayDate) {
isValid = true;
}
else
isValid = false;
e.preventDefault();
if (isValid == false)
{
popupNotification.show("Delivery Date should be today date or Greater", "error");
}
$('#Previous').show();
$('#Next').show();
}
Its working fine when I give the future dates but its not working for today date. I also need to check the today's date. I am not able to figure it out the error alert when I try to enter to the today date .
You are comparing two objects of the same type, but different objects, so that will always result in 'unequal'
If you use date.getTime() you will get better results in your comparison - but only if the time component is the same of course.
Think of the Date object like a timestamp. It is based on the unix-style of timestamps (the amount of seconds since 1st January, 1970) so the Date object isn't the day, it is the Date AND the Time.
What you're comparing is the times as well, which could get a little iffy. If only days matter, try using:
fullCompareDate = compareDateModified.getFullYear() + "/" + compareDateModified.getMonth() + "/" + compareDateModified.getDate();
fullTodayDate= todayDate.getFullYear() + "/" + todayDate.getMonth() + "/" + todayDate.getDate();
if(compareDateModified>todayDate||fullCompareDate==fullTodayDate)
{
//Do something
}
This will compare the date and time to make sure they are greater OR check the current date with the compare date (as strings)
Another solution is to blank out the times on both dates:
compareDateModified.setHours(0,0,0,0);
todayDate.setHours(0,0,0,0);
if(compareDateModified>=todayDate)
{
//Do something
}
You are comparing the compareDateModified to todayDate on the millisecond level. To compare at the day level:
var todayDate = new Date();
todayDate.setHours(0,0,0,0);
//you may also have to truncate the compareDateModified to the first
//second of the day depending on how you setup compareDate
if (compareDateModified >= todayDate) {
isValid = true;
}

Bind a event listener to a submit form between a specific date and time in JavaScript

I want to popup a message when user click on submit button between the date of 2012-01-22, 00:00 to 2012-01-25, 23:59. I write the code as below, but it won't works. Could someone suggest how to convert the date to integer so that I can check if today date is greater than x and less than x, then popup the message?
Thanks
function holiday_alert_msg() {
var today_date = new Date();
if (today_date > 201201220000 && today_date < 201201252359) {
alert("Today is holiday");
}
}
$('#submit').bind('click', function() {
holiday_alert_msg();
});
You can do this:
function holiday_alert_msg() {
var today_date = new Date();
// The month parameter is 0 based
if (today_date > new Date(2012,0,22) && today_date < new Date(2012,0,25,23,59)) {
alert("Today is holiday");
}
}
$('#submit').bind('click', holiday_alert_msg);
var now = new Date();
console.log(now.getDate()); // 11 - day of month
console.log(now.getMonth()); // 0 - 0 indexed month (0 is January)
console.log(now.getFullYear()); // 2012 - 4 digit year
The Date prototype has some useful methods that can make it easier to compare these values. I leave how to use them as an exercise for you :)

Categories