CODEWITHSUNDEEP
javascripthtmlfunctiontimecompare
Sachini Karunaratne
Sachini Karunaratne

Reputation: 49

comparing current time with input time in javascript

From the following html and javascript code i hope to compare the input time with current time! If the input time is less than 2 hours i want to print "Less time" in the label and if its more than 2 hours i want to print "sufficient time" in the label!

 
    function test(){
    	var element = document.getElementById("time").value;
    	var d = new Date();
        var n = d.getTime();
    	if(element-n>2){
    		 document.getElementById("check").innerHTML="sufficient time";
    	}
    	else{
    		document.getElementById("check").innerHTML="Less time";
    	
    	}
    }
 
    <html>
    
    <body>
    	<form>
    		<span>Time</span>
    	<input type="time" id="time">
    		
    		  <input type="button" value="CHECK"   onclick="test();"> <br>
    		<label id="check"></label>
              <input class="button" type=reset name=reset value=Cancel>
    	</form>
    </body>
    </html>

when i evaluate this i always get less time! How can i correct mycode?

Upvotes: 1

Views: 19370

Answers (4)

Kashyap Merai
Kashyap Merai

Reputation: 862

Working example of your code

function test() {

  var element = document.getElementById("time").value;
  
  if (element == "") {
  alert("Please Enter Time");
    return false;  
  }
  else {
  
  // get system local time
  var d = new Date();
  var m = d.getMinutes();
  var h = d.getHours();
  if(h == '0') {h = 24}
  
  var currentTime = h+"."+m;
  console.log(currentTime);
 
  // get input time
  var time = element.split(":");
  var hour = time[0];
  if(hour == '00') {hour = 24}
  var min = time[1];
  
  var inputTime = hour+"."+min;
  console.log(inputTime);
  
  var totalTime = currentTime - inputTime;
  console.log(totalTime);
  
  if ((Math.abs(totalTime)) > 2) {
    document.getElementById("check").innerHTML = "sufficient time";
  } 
  else {
    document.getElementById("check").innerHTML = "Less time";

  }
    }
}
<html>

<body>
  <form>
    <span>Time</span>
    <input type="time" id="time" required>

    <input type="button" value="CHECK" onclick="return test();">
    <br>
    <label id="check"></label>
    <input class="button" type=reset name=reset value=Cancel>
  </form>
</body>

</html>

Upvotes: 4

Tornseglare
Tornseglare

Reputation: 1167

getTime() returns milliseconds, so to get two hours, simply multiply 1000 * 60 * 60 to get one hour in milliseconds.

element will contain a string, like "12:30" and must be converted, this one might help you further:

Convert string to time JavaScript (h:m)

Hope it helps.

Upvotes: 0

dev8080
dev8080

Reputation: 4020

You are not considering that input value in your field has to be parsed to a Date value to be of any use in calculation:

function test(){
    var timeNow = new Date();
    var tm = document.getElementById("time");
    var timeParts = tm.split(":");
    var inputTime = new Date(timeNow.getYear() , timeNow.getMonth() ,     timeNow.getDate() , parseInt(timeParts[0]), parseInt(timeParts[1]), 0, 0);

    var diff = Math.abs(timeNow.getTime() - inputTime.getTime());

    if( diff > 2*60*60*1000 ) 
        document.getElementById("check").innerHTML="sufficient  time";
    else
        document.getElementById("check").innerHTML="Less time";
     }

I am assuming you are checking for two hours before or after the current time. If not, feel free to remove the Math.abs and use accordingly.

Upvotes: 1

skeltoac
skeltoac

Reputation: 167

This is essentially a type mismatch. You are comparing a timestamp to a time string. The getTime() returns a timestamp that specifies a time on a particular date, whereas the time string is just a string such as 02:02 which doesn't specify a date.

You will need to collect date and time from inputs, then construct a Date object from the input, then compare two getTime() results. That way you will be comparing two timestamps.

It is important that the input includes the date because of what happens around midnight. If the current time is 23:30 and the input time is 01:15, how will your code know whether the user meant 1:15 tomorrow morning?

Upvotes: 0

Related Questions