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-25T11:56:40.163

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 '17 at 11:56

answered Mar 25 '17 at 11:47

kind user

40,029
7
67
77

i totally forgot about that "else" thanks for your help <: – AmirWG Mar 25 '17 at 11:57
@AmirWG Check also the second way how to achieve a proper result even quicker. (: – kind user Mar 25 '17 at 11:59
1

Note that `"" % 1` and `null % 1` both return `0`, so the modulo method has its quirks. – RobG Mar 25 '17 at 13:05
@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? – kind user Mar 25 '17 at 13:10
Where the input is expected to be a string it seems sensible to ensure strings, at least, are integers. A suitable [polyfill for *isInteger*](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isInteger) is at MDN. – RobG Mar 25 '17 at 22:12
1

This is not working in IE. https://stackoverflow.com/questions/26482645/number-isintegerx-which-is-created-can-not-work-in-ie – illinoistim Sep 26 '18 at 14:45

score 0 · Answer 2 · answered Mar 25 '17 at 11:51

0

Uhm how about try this:

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

answered Mar 25 '17 at 11:51

Putra Christianto Purba

356
3
9

Why bother with the *isNaN* test? `Number.isInteger(NaN)` returns false so testing separately for NaN doesn't add anything. – RobG Mar 26 '17 at 11:08

score 0 · Answer 3 · answered Mar 25 '17 at 11:54

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"

checking if input is integer using javascript

3 Answers3