checking if input is integer using javascript

Question

that's what I have tried :

<html>
<head>
<script>
function myFunction() {
var num = document.getElementById("num").value;
if (Number.isInteger(num)) { 
document.getElementById("show").innerHTML = "Number is integer";
} else {
document.getElementById("show").innerHTML = "Number is not integer";
}
</script>
</head>
<body>
<input id = "num"></input>
<button onclick = "myFunction()">Submit</button>
<p id = "show">Result Appears Here</p>
</body>
</html>

the problem here is that i get "number is not integer" all the time even if the number is integer , the code supposed to check if input is integer or not thanks in advance

kind user · Accepted Answer · 2017-03-25 11:56:40Z

8

The value of the #num element is returned as a string as you can see in the console. Just revert it into a number using + sign.

Another thing - you are overwriting the innerHTML attribute of the #num element with every function call. You have to insert the second action document.getElementById("show").innerHTML = "Number is not integer" into the else statement to avoid overwriting.

function myFunction() {
  var num = document.getElementById("num").value;
  console.log(typeof num);

  if (Number.isInteger(+num)) {
    document.getElementById("show").innerHTML = "Number is integer";
  } else {
    document.getElementById("show").innerHTML = "Number is not integer";
  }
}

<input id="num"></input>
<button onclick="myFunction()">Submit</button>
<p id="show">Result Appears Here</p>

There's also another way to check if a number is integer, using modulo.

function myFunction(num) {
  num % 1 ? console.log("Not Integer") : console.log("Integer");
}

myFunction(5);
myFunction(5.5);

edited Mar 25, 2017 at 11:56

answered Mar 25, 2017 at 11:47

kind user

42k8 gold badges69 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

AmirWG Over a year ago

i totally forgot about that "else" thanks for your help <:

kind user Over a year ago

@AmirWG Check also the second way how to achieve a proper result even quicker. (:

RobG Over a year ago

Note that "" % 1 and null % 1 both return 0, so the modulo method has its quirks.

kind user Over a year ago

@RobG Following your logic - we could put anything else instead of a number - empty object, random string or anything else and probably the output would be improper, but... for what? OP is clearly assuming that the input will be a number. Of course - we could make a condition that if the input isn't typeof number, return false or anything, but does OP actually desires it?

illinoistim Over a year ago

This is not working in IE. stackoverflow.com/questions/26482645/…

|

Putra Christianto Purba · Accepted Answer · 2017-03-25 11:51:21Z

0

Uhm how about try this:

if(!isNaN(num)){
    if(Number.isInteger(num){
        //your code
    } else {
        //your code
    }
}

answered Mar 25, 2017 at 11:51

Putra Christianto Purba

4164 silver badges9 bronze badges

1 Comment

RobG Over a year ago

Why bother with the isNaN test? Number.isInteger(NaN) returns false so testing separately for NaN doesn't add anything.

Manngo · Accepted Answer · 2017-03-25 11:54:26Z

Just a little bit of advice: learn how to properly indent your code:

function myFunction() {
    var num = document.getElementById("num").value;
    if (Number.isInteger(num)) { 
        document.getElementById("show").innerHTML = "Number is integer";
    }
    document.getElementById("show").innerHTML = "Number is not integer";
}

If you do, you will easily see that the last line will replace whatever you have put into the paragraph with Number is not integer.

You need an else to finish the job.

Also, whatever comes out of a text box is a string, so you will have to run it through parseInt first.

This might work better:

function myFunction() {
    var num = parseInt(document.getElementById("num").value,10);
    if (Number.isInteger(num)) { 
        document.getElementById("show").innerHTML = "Number is integer";
    }
    else document.getElementById("show").innerHTML = "Number is not integer";
}

Also:

input is a void element, meaning that it doesn’t have a closing tag.
For HTML attributes, you really shouldn’t have spaces around the = sign, as some browsers misinterpret this. For example: id="something"

Collectives™ on Stack Overflow

checking if input is integer using javascript

3 Answers 3

6 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related