I'm facing an issue when trying to set the date and time of Calendar in primefaces 6.1 using javascript. I used the following code and at first, it was working but suddenly it stopped working. Now I can't figure out how to fix this thing. Sometimes it changes the date part but not the time part.
var recievedDateValue = PF('recievedDate').getDate();
PF('collectedDate').setDate(recievedDateValue);
XHTML Part:
<p:calendar id="caseCollectedDate" widgetVar="collectedDate" tabindex="50" value="#{caseController.selectedCase.caseCollectedDate}"
converter="DateConverter"
converterMessage="Please enter valid date time format" pattern="MM/dd/yy HH:mm" maxdate="#{viewUtilityBean.currentDate}"
timeControlType="slider" onfocus="getFocusElementId()" onchange="validateDate('collectedDate')">
<p:remoteCommand name="validateCollectedDateFromServer" update="#this"/>
</p:calendar>
DateConverter (getAsObject method):
if (!value.contains(":")) {
date1 = new SimpleDateFormat("MM/dd/yy").parse(value);
value = new SimpleDateFormat("MM/dd/yy HH:mm").format(date1.getTime());
date1 = new SimpleDateFormat("MM/dd/yy HH:mm").parse(value);
} else {
date1 = new SimpleDateFormat("MM/dd/yy HH:mm").parse(value);
}
I tried multiple ways to somehow work this but it is not working. Though setdate function calls the onchange event but the date doesn't change.
I overrode the setDate function of the primefaces calendar widget to the following.
The following are the snippets I tried.
setDate : function(a) {
var month = a.getMonth();
var date = a.getDate();
var year = a.getFullYear();
var hour = a.getHours();
var min = a.getMinutes();
this.jqEl.datetimepicker("setDate",new Date(month,date,year,hour,min))
}
setDate : function(a) {
var month = a.getMonth();
var date = a.getDate();
var year = a.getFullYear();
var hour = a.getHours();
var min = a.getMinutes();
this.jqEl.datetimepicker({
userCurrent: false,
format: 'MM-dd-yy HH:mm',
date: new Date(month,date,year,hour,min)
})
}
setDate : function(a) {
var month = a.getMonth();
var date = a.getDate();
var year = a.getFullYear();
var hour = a.getHours();
var min = a.getMinutes();
this.jqEl.datetimepicker({
date: new Date(month,date,year,hour,min)
})
}
setDate : function(a) {
var month = a.getMonth();
var date = a.getDate();
var year = a.getFullYear();
var onlyDate = month+"/"+date+"/"+year;
var hour = a.getHours();
var min = a.getMinutes();
this.jqEl.datetimepicker({
date: onlyDate,
hour: hour,
minute: min
})
}
setDate : function(a) {
$('#clientTabs\\:j_idt1125\\:caseCollectedDate_input').data("DateTimePicker").date(a);
}
Calendar looks like this.
Related
I am trying to convert the date and time that is obtained from UI to epoch Time.
Please find my code below.
function calculateEpoch(){
var date = 11/1/2019 //obtained from ui
var time = 11:00 //obtained from ui
var date1 = date +"" + time;
var someDate = new Date(date1);
console.log("someDate : ",someDate) //getting error like Invalid Date
someDate1 = someDate.getTime();
console.log("someDate : ",someDate1) //getting error like someDate1 is not defined
return someDate1 ;
}
Could anyone please help me with the working code.
Add " "instead of "" in var date1 = date +" " + time; It will work
function calculateEpoch(){
var date = '11/1/2019' //obtained from ui
var time = '11:00' //obtained from ui
var date1 = date +" " + time; // <---add space here
var someDate = new Date(date1);
console.log("someDate : ",someDate) //getting error like Invalid Date
someDate1 = someDate.getTime();
console.log("someDate : ",someDate1) //getting error like someDate1 is not defined
return someDate1 ;
}
function calculateEpoch(){
var date = '11/1/2019' //obtained from ui
var time = '11:00' //obtained from ui
var date1 = `${date} ${time}`; // add a space in between the date and time,
// your date1 was invalid because it 11/1/2019:11:00
var someDate = new Date(date1);
console.log("someDate : ",someDate) //getting error like Invalid Date
someDate1 = someDate.getTime();
console.log("someDate : ",someDate1) //getting error like someDate1 is not defined
return someDate1 ;
}
hope this helps
Your first 2 lines of date and time are obtained from ui so I assume that's not the problem here. (They should be string)
The problem is with date1.
You have: 11/1/201911:00 Invalid
Should be: 11/1/2019 11:00
You were almost there but you only needed to add a space between date and time.
function calculateEpoch(){
var date = '11/1/2019'; //obtained from ui
var time = '11:00'; //obtained from ui
var date1 = date + " " + time;
var someDate = new Date(date1);
console.log("someDate : ", someDate) //getting error like Invalid Date
someDate1 = someDate.getTime();
console.log("someDate : ", someDate1) //getting error like someDate1 is not defined
return someDate1;
}
calculateEpoch();
Here's a way of doing it where the connection to the UI and the Date construction parameters are explicit:
function calculateEpoch() {
var year = new Number(document.getElementById('uiYear').value);
var month = new Number(document.getElementById('uiMonth').value) - 1;
var day = new Number(document.getElementById('uiDay').value);
var hours = new Number(document.getElementById('uiHour').value);
var minutes = new Number(document.getElementById('uiMinute').value);
var seconds = new Number(document.getElementById('uiSecond').value);
var d = new Date(year, month, day, hours, minutes, seconds, 0);
var millis = d.getTime();
return millis
}
This function (under a different name) can actually be seen in action together with its UI at https://currentmillis.com on the right-hand side.
Note that the month parameter of this Date constructor is zero-based (January is 0, December is 11): https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#Syntax
I am trying to create a new Date using 2 dates I have. Basically my new date
Output:
Date 1 = (presentdate +1 month , endDate+1 day, presentdate+1 year);
//Example 1:
var presentDate = "11/12/2018";
var endDate = "2/8/2018";
var Dat1 = "12/9/2018"; //new date
//Example 2 :
var presentDate = "11/12/2018";
var endDate = "5/25/2018";
var Dat1 = "12/26/2018"; //new date
//Example 3 :
var presentDate = "1/5/2018";
var endDate = "5/30/2018";
var Date1 = "2/31/2018"; // invalid date
//should've been 2/28/2018 since that is the last day of the month
//Example 4:
var presentDate = "3/5/2018";
var endDate = "10/30/2018";
var Date1 = "4/31/2018"; //Invalid date. Should've been 4/30/2019 since it's last day of the month
My code:
var mPresent = moment(presentDt);
var mEnd = moment(eDt);
var Date1 = moment({
year: mPresent.year(), // get presentDt's year
month: mPresent.add(1, 'month').month(), // get presentDt's month
date: mStart.date() // get startdt day of the month
});
console.log(Date1);
It doesn't work in all cases because not every month have 30,31 days and then there is the leap year. I need to create a date that is valid because in some of these cases it returns invalid date.
Any help is appreciated. Thank you!
I'm not entirely sure what's going on with your code, but I chopped out most of it and basically did a 1-liner to calculate the # of months difference - seems to work.
document.querySelector("#ok").addEventListener("click", function () {
var paymentDate = document.getElementById("presentDate").value;
var etDate = document.getElementById("endDate").value;
var RemainingPayments = moment(etDate).diff(moment(paymentDate), 'months');
console.log(RemainingPayments);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
<label>Present date</label><input id="presentDate" name="presentDate" type="date">
<label>End Date</label> <input id="endDate" name="endDate" type="date">
<button id='ok'>OK</button>
I'm using http://www.eyecon.ro/bootstrap-datepicker/. I am trying to set default day as 1 of month.
<script>
var firstDayOfMonth = function() {
// your special logic...
return 1;
};
var d = new Date();
var currMonth = d.getMonth();
var currYear = d.getFullYear();
var startDate = new Date(currYear,currMonth,firstDayOfMonth());
console.log(startDate);
$('#dp1').datepicker('setDate',startDate);
</script>
But it doesnt work as expected.Instead it comes with today's date.What i am doing wrong?
I have to pretty much validate and check if the user is underage in ASP. So anyone under the age of 01/07/1998 is underage. I have 3 dropdown lists to select date, month and year. Im using JS. I try using concat and split but they dont work. Can anyone help with this?
function ValidateDate() {
var dDay = document.getElementById('DateList');
var dMonth = document.getElementById('MonthList');
var dYear = document.getElementById('YearList');
var day = dDay.selectedIndex;
var month = dMonth.selectedIndex;
var year = dYear.selectedIndex;
var firstValue = year + month + day;
var setyear = "1998";
var setmonth = "06";
var setdate = "01";
var secondValue = setyear + setmonth + setdate;
var firstDate = new Date();
firstDate.setFullYear(firstValue[0], (firstValue[1] - 1), firstValue[2]);
var secondDate = new Date();
secondDate.setFullYear(secondValue[0], (secondValue[1] - 1), secondValue[2]);
if (firstDate > secondDate) {
alert("Pass");
}
else {
alert("Fail");
}
}
<asp:CustomValidator ID="CustomValidatorDate" runat="server"
ErrorMessage=" You are underage" CssClass="error" Display="Dynamic" ClientValidationFunction="ValidateDate" ></asp:CustomValidator>
First of all your day, month and year variables are reading the index of the drop-downs and not their values.
For instance, you need to use:
var day = dDay.value,
month = dMonth.value,
year = dYear.value;
And then create date object as
var firstDate = new Date(year, month, day);
-Dipen
I am trying to check if a date of format mm.dd.yyyy is greater than today and less than the date after 6 months from today.
Here is my code:
var isLinkExpiryDateWithinRange = function(value) {
var monthfield = value.split('.')[0];
var dayfield = value.split('.')[1];
var yearfield = value.split('.')[2];
var inputDate = new Date(yearfield, monthfield - 1, dayfield);
var today = new Date();
today = new Date(today.getFullYear(), today.getMonth(), today.getDate());
alert(inputDate > today);//alert-> true
var endDate = today;
endDate.setMonth(endDate.getMonth() + 6);
alert(inputDate > today);//alert-> false
if(inputDate > today && inputDate < endDate) {
alert('1');
} else {
alert('2');/always alert it
}
}
If I execute isLinkExpiryDateWithinRange('12.08.2012') I wish it will show 1 as this is within the range, but it is displaying 2. Moreover the first alert is showing true and the second one false.
Can anyone please explain what is happening?
Change:
var endDate = today;
to:
var endDate = new Date(today);
See the posts here for how objects are referenced and changed. There are some really good examples that help explain the issue, notably:
Instead, the situation is that the item passed in is passed by value.
But the item that is passed by value is itself a reference.
JSFiddle example
function isLinkExpiryDateWithinRange( value ) {
// format: mm.dd.yyyy;
value = value.split(".");
var todayDate = new Date(),
endDate = new Date( todayDate.getFullYear(), todayDate.getMonth() + 6, todayDate.getDate() +1 );
date = new Date(value[2], value[0]-1, value[1]);
return todayDate < date && date < endDate;
}
isLinkExpiryDateWithinRange("12.24.2012"); // true
isLinkExpiryDateWithinRange("12.24.2020"); // false
Below function checks if date selected is within 5 days from today. Date format used is "DD-MM-YYYY", you can use any format by changing value.split('-')[1] order and split character.
function showMessage() {
var value = document.getElementById("invoiceDueDate").value;
var inputDate = new Date(value.split('-')[2], value.split('-')[1] - 1, value.split('-')[0]);
var endDate = new Date();
endDate.setDate(endDate.getDate() + 5);// adding 5 days from today
if(inputDate < endDate) {
alert("If the due date selected for the invoice is within 5 days, and express settlement fee will apply to this transaction.");
}
}