Using Isnan() Function

[pakoch]

Hi,

 

When testing a user input to see if it is a number, just using isNaN() function does not appear to work without doing some kind of conversion to the input.  Here is a snippet of what I am working on:

 

var number = document.getElementById('number');

  if (isNaN(number)) {
   alert('Not a number');
  }
  else {
   alert('Is a number');
  }

 

Regardless of whether a letter or number is entered by the user, the isNaN function is true and the first alert is posted.

 

Can someone tell me if I am correct?  and if so, what conversion needs to be done on the 'number' input to get it to be properly evaluated by the isNaN function? 

 

Thank You,

Peter Koch

[HartleySan]

All values pulled from the DOM are strings by default.

As such, you should use the parseInt function to convert the String-number into a Number-number, if you know what I mean.

Here's some more info on the parseInt function:

https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/parseInt

 

Also, in the event that the string cannot be converted to a number, then the number constant NaN will be returned by the parseInt function, which you can use the isNaN function to test for.

Here's some more info on number constants in JS:

http://msdn.microsoft.com/en-us/library/ie/ff806190(v=vs.94).aspx

 

Hope that helps.

 

Edit: I should note that I assumed you're dealing with integers, but in the event that you're not, you may need to use the parseFloat function instead. Here's a link:

https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/parseFloat

[pakoch]

Thanks, I read through the material and it helps.  However, I am still very new to this and I must be missing something.  I am trying to use parseInt to convert the user entered number, which is actually a string, into an integer.  Then I want to check it using the isNaN function to be sure the user actually entered a number.   Regardless of whether I enter a number or letters, it is evaluated as NaN.  Here is what I am working with:

 

var a = document.getElementById('number');
  parseInt('a',10);

  if (isNaN(a)) {
   alert('Not a number');
  }
  else {
   alert('Is a number');
  }

 

Am I using the parseInt funcation incorrectly?  Thanks for your help.

 

Peter

[HartleySan]

No, you're not.

You need to assign the result of the parseInt function to a variable.

[pakoch]

Do you mean like this:

 

var a = document.getElementById('number');
var b = parseInt('a',10);

if (isNaN( b ) {
alert('Not a number');
}
else {
alert('Is a number');
}

 

Because for some reason this also does not work like it should.  I also did a test where I tried to display the length of variable b and it comes back undefined. 

Thanks,

Peter

 

Also, I don't understand why I can't get rid of the smily face; it just keeps popping up?  There should be a "b" in place of it.

[HartleySan]

In the following code, the variable a is not equal to a number, it's equal to a DOM element:

 

var a = document.getElementById('number');

 

If the DOM element "number" is a text input, then use "a.value" to refer to the actual value stored in the DOM element.

If "number" is something like a div, then you'll have to use a property like "innerHTML" instead.

[Larry]

The smiley face is the replacement of the combination of the letter "b" and the closing parentheses. I inserted a space between them to correct it.

[pakoch]

Thanks for the smiley face information Larry; I thought it might be something like that causing the problem.

 

HarlleySan, your suggestion of using .value worked for me.  However, I am not using the parseInt function now.  Do you still see any reason why the parseInt function should be used in this case?   Here is what I wrote to test isNaN.  I put some extra alert boxes in there so I could see what was happening to the variables, but you can see that I am testing each variable with isNaN.

 

function isNaNtest() {

  'use strict';

  var number_1 = document.getElementById('number_1');
  var number_2 = document.getElementById('number_2');

  alert('The first number is ' + number_1.value);
  alert('The second number is ' + number_2.value);

  if ((isNaN(number_1.value)) && (isNaN(number_2.value))) {
   alert('Both inputs are Not a Number');
  }
  else if ((isNaN(number_1.value)) && (!isNaN(number_2.value))) {
   alert('The 1st input is NaN, the 2nd input is OK');
  }
  else if ((!isNaN(number_1.value)) && (isNaN(number_2.value))) {
   alert('The 1st input is OK, the 2nd input is NaN');
  }
  else if ((!isNaN(number_1.value)) && (!isNaN(number_2.value))) {
   alert('Both inputs are OK');
  }
  else {
   alert('Unknown');
  }
}
function init() {
   'use strict'
   document.getElementById('theForm').onsubmit = isNaNtest;
  }
window.onload = init;