.Click function trigger just one time in java script - javascript

I read many questions here but not find a solution for problem.
I have one page which has two dates and one text box. When I click on text box the difference of two dates in days will show on text box. But when I change the dates and click on text box it doesn't work.
Code
$('#totalNoOfLeave').click(function(){
var date1 = new Date($('#leaveStartDate').getValue());
var date2 = new Date($('#leaveEndingDate').getValue());
var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
$('#totalNoOfLeave').setValue(diffDays);
});
Please help.

Use this :
$('body').on('click', '#totalNoOfLeave', function () {
var date1 = new Date($('#leaveStartDate').getValue());
var date2 = new Date($('#leaveEndingDate').getValue());
var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
$('#totalNoOfLeave').setValue(diffDays);
});

Related

Count Down Stoped After Changed the Date

I was trying to implement count down timer for my web site. I want to give two static dates to and get the count down running. I found an example that uses one hard code date and the other date is taken as new Date() . but when I change that new Date() to Hard Code values count down timer stopped . How to fix this issue .
Original Example I found in jsfiddle.net
My modified Example in jsfiddle.net
the only difference in those examples is i changed var date1 = new Date(); to var date1 = new Date("2017/07/22 20:30:00");
The dates that you provided will never change since you are continually calling the same function each interval (i.e. the difference between date1 and date2 will never change).
If you want a countdown, you'll need to use some relatively changing date similar to the original example you provided or retain an offset (i.e. store when you started the process and continually use an offset for your calculations) as seen below:
// Store a relative date to track passing time
var started = new Date();
showDiff();
function showDiff() {
// Keep track of the time that has elapsed
var offset = new Date() - started;
// Store your dates
var date1 = new Date("2017/07/22 20:30:00") - offset;
var date2 = new Date("2015/07/30 21:59:00");
// Calculate the differences
var diff = Math.abs(Math.floor((date2 - date1) / 1000));
var days = Math.floor(diff / (24 * 60 * 60));
var daysLeft = diff - days * 24 * 60 * 60;
var hours = Math.floor(daysLeft / (60 * 60));
var hoursLeft = daysLeft - hours * 60 * 60;
var minutes = Math.floor(hoursLeft / (60));
var minutesLeft = hoursLeft - minutes * 60;
var seconds = Math.floor(minutesLeft / 60);
var secondsLeft = minutesLeft - seconds * 60;
// Output
document.getElementById("showTime").innerHTML = "You have " + days + " days " + hours + " hours " + minutes + " minutes and " + secondsLeft + " seconds before death.";
setTimeout(showDiff, 1000);
}
<div id='showTime'></div>

Javascript Date/Time not Working on iOS Device with Chrome

I am working with date/time in javascript and it is working properly on chrome windows but it is not working within Chrome on iOS devices. The difference between two times is not calculated properly on iOS.
Here is my code:
var start_timeObj = moment(start_time, ["h:mm A"]);
var end_timeObj = moment(end_time, ["h:mm A"]);
var start_time=start_timeObj.format("HH:mm");
var end_time=end_timeObj.format("HH:mm");
var diff = ( new Date("1970-1-1 " + end_time) - new Date("1970-1-1 " + start_time) ) / 1000 / 60 / 60;
if(diff==1)
{
If you don't want to use moment you could try using:
var date1 = new Date('1998-07-20');
var date2 = new Date('1998-07-23');
var diffTime = Math.abs(date2.getTime() - date1.getTime());
diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24)) + 1;
If you don't add 1 to diffDays the end date won't be included.
You can do exactly the same using a H:m:s format (https://playcode.io/396986?tabs=script.js,preview,console)
Have you tried using moment's built in diff functionality?
var start = moment(start_time, ["h:mm A"]);
var end = moment(end_time, ["h:mm A"]);
var diffMilliseconds = end.diff(start) // outputs 3600000 (in ms)
var diffHours = diff / 1000 / 60 / 60; // outputs 1
Documentation:
https://momentjs.com/docs/#/displaying/difference/

Convert difference now and a random date to seconds

I have a question :
I have a coutdown timer. And I want to calculate the difference between today and a random date. My code is :
<script type="application/javascript">
function doneHandler(result) {
alert('test')
}
var d2 = new Date();
var d1 = new Date("{{ a_data.a_promo[0].getEndDate()|date("Y-m-d H:i:s") }}");
var myCountdown1 = new Countdown({
time: (d1-d2) * 3,
width:300,
height:60,
rangeHi:"day",
style:"flip", // <- no comma on last item!,
onComplete : doneHandler
});
</script>
The {{ a_data.a_promo[0].getEndDate()|date("Y-m-d H:i:s") }} is 2017-08-09 12:12:12 but i get the diference about 14 days but the real difference is about 47 days. Can you help me please ? Thx in advance and sorry for my english
You can do it like below (javascript):-
var d2 = new Date();
var d1 = new Date("2017-08-09 12:12:12");
var timeDiff = Math.abs(d2.getTime() - d1.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
console.log(timeDiff);
console.log(diffDays);
Note:- now pass this timeDiff or diffDays to your time: inside new Countdown({..});

Get difference between 2 dates in javascript

var date1 = new Date("04.11.2016");
var date2 = new Date("19.11.2016");
var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
alert(diffDays);
Trying get different between those Dates, but my date format is that "04.11.2016", Result show NaN
var date1 = new Date("11/04/2016");
var date2 = new Date("11/19/2016");
var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
alert(diffDays);
change the format of date.
it should be MM/DD/YYYY
Hope this helps.
The easiest way is to use moment.js library:
var date1 = moment('04.11.2016', 'MM.DD.YYYY'),
date2 = moment('19.11.2016', 'MM.DD.YYYY'),
diffDays = date2.diff(date1, 'days'); // you can wrap it in Math.abs()
The ugly js way:
var input1 = '04.11.2016',
parts1 = input1.split('.'),
date1 = new Date(parts1[2], parts1[1], parts1[0]),
input2 = '19.11.2016',
parts2 = input2.split('.'),
date2 = new Date(parts2[2], parts2[1], parts2[0]),
timeDiff = Math.abs(date2.getTime() - date1.getTime()),
diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
Change the Month and Date order First should be month then date... MM/DD/YYYY
var date1 = new Date("11.04.2016");
var date2 = new Date("11.19.2016");
var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
alert(diffDays);
Your second date is incorrect. Parser is considering this format MM.DD.YYY and you have supplied out of range month.
var date1 = new Date("04.11.2016");
var date2 = new Date("09.11.2016");
var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
alert(diffDays);
A date consists of a year, a month, a day, an hour, a minute, a second, and milliseconds.
Date objects are created with the new Date() constructor.
There are 4 ways of initiating a date:
new Date()
new Date(milliseconds)
new Date(dateString)
new Date(year, month, day, hours, minutes, seconds, milliseconds)
so you can split them and then use it
Just change the first two lines as below
var date1 = new Date(2016,11,4);
var date2 = new Date(2016,11,19);
new date("mm dd yyyy") format was wrong
(function () {
var date1 = new Date("11 04 2016");
var date2 = new Date("11 19 2016");
var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
console.log(diffDays);
})()
JS expects date to in MM-DD-YYYY and not DD-MM-YYYY. Ideal way would be to use moment.js, but you can use something like this:
function createCustomDate(dateString){
var dateArr = dateString.split(/[^0-9]/).reverse().join("-")
return new Date(dateArr);
}
var dateStr1 = "04.11.2016";
var dateStr2 = "19.11.2016";
var date1 = createCustomDate(dateStr1);
var date2 = createCustomDate(dateStr2);
var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
console.log(diffDays);
new Date("19.11.2016");
this is Invalid Date. So, difference is be NaN .
change the format to mm/dd/yyyy and it will work.
You can use moment.js,
d = moment('11.16.2016') // here date format was in "MM.DD.YYYY"
e = moment('11.04.2016') // here date format was in "MM.DD.YYYY"
getDiffbydays = e.diff(d,'days') // get diff by days you can use day
getDiffbyyears = e.diff(d,'year') // get diff by years you can use year
getDiffbymonth = e.diff(d,'month') // get diff by months you can use month
Check this solution which uses a function called getDate to convert the date string of the format "04.11.2016" to a JavaScript Date object.
function getDate(dateStr) {
var arr = dateStr.split('.');
return new Date(arr[2], arr[1], arr[0]);
}
var start = getDate("04.11.2016");
var end = getDate("19.11.2016");
var timeDiff = Math.abs(end.getTime() - start.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 60 * 60 * 24))
console.log('Number of days: ' + diffDays);
In order to use this code to create a Custom JavaScript Variable in Google Tag Manager, you can modify the above code or the one which you choose to be inside a function - reference.

Date difference between dates in Javascript and datediff mysql not equal

I have a javascript function that returns the number of days between two dates, but it seems to return a day less then what mysql dateDiff function would return
function dateDiffInDays() {
var date1 = new Date("05/30/2012");
var date2 = new Date("11/29/2013");
var diffDays = parseInt((date2 - date1) / (1000 * 60 * 60 * 24));
alert(diffDays );
}
if I use this two dates in the mysql function, i get 548, where as with javascript, I get 547, what does mysql and excel do with their functions thats different with javascript
Since we're suspecting a timezone problem, you could try something like this:
function dateDiffInDays() {
var date1 = new Date("05/30/2012");
var date2 = new Date("11/29/2013");
var utc1 = Date.UTC(date1.getFullYear(), date1.getMonth(), date1.getDate());
var utc2 = Date.UTC(date2.getFullYear(), date2.getMonth(), date2.getDate());
var diffDays = parseInt((utc2 - utc1) / (1000 * 60 * 60 * 24));
alert(diffDays);
}
I'm not sure, though. Theoretically, your function should have worked too.
They both return 548 days:
Javascript
var date1 = new Date("05/30/2012");
var date2 = new Date("11/29/2013");
var diffDays = parseInt((date2 - date1) / (1000 * 60 * 60 * 24));
diffDays
548
MySQL
select datediff('2013-11-29','2012-05-30');
548
I get 548 from your previous javascript function. However if there is 1 difference between your javascript and the mysql it is because your javascript calculation is slightly off. Try:
function dateDiffInDays() {
var date1 = new Date("05/30/2012");
var date2 = new Date("11/29/2013");
var date1days = parseInt(date1 / (1000 * 60 * 60 * 24));
var date2days = parseInt(date2 / (1000 * 60 * 60 * 24));
var diffDays = date2days - date1days;
alert(diffDays);
}

Categories