6

Basically I have the following code:

<input type="text" value="123" id="txtbox">
<script>
var myVar = document.getElementById('txtbox').value;

if (myVar.substring) {
alert('string');
} else{
alert('number');
}
</script>

No matter what value you put in the textbox, it will always alert string. Is there a way that if you put a number in the textbox it will alert number instead of string? Thank you.

2 Answers 2

13

value on input elements is always a string. It might be a string of digits.

If you want to know whether that string only contains valid numbers, you have to parse it (and decide what you consider a valid number, and allow for that).

For instance, you'll get people telling you to use parseInt(myVar) or the unary + (+myVar) or isNaN(myVar) (which does what the unary + does) or Number(myVar) (same), but:

  1. parseInt only parses the beginning of the string, parseInt("345foo") is 345

  2. parseInt is, of course, only for whole numbers; you'd want parseFloat for numbers with fractional portions

  3. All of those will fail to understand thousands separators

  4. All of those will fail to understand a decimal separator that isn't . (e.g., in many locales it's , or sometimes even a space)

  5. +myVar and Number(myVar) and isNaN(myVar) and such will treat an empty string as 0

...that kind of thing. So you have to do some prep on the string according to what input you want to accept.

Once you've decide what format(s) to handle, there are a dozen questions with answers here about doing the actual parsing:

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

2 Comments

why ParseInt and not isNaN like @KJ Price ?
you can use typeof to detect type of variable in js, then you can see as @T.J. Crowder said that alert(typeof(document.getElementById('txtbox').value)); always return string
5

is isNaN (literally "is Not a Number"):

var myVar = document.getElementById('txtbox').value;

var myNum = +myVar;//as suggested by T.J. 
if (isNaN(myNum)) {
   alert('string');
} else{
   alert('number');
}

7 Comments

This will, of course, fail for numbers with thousands separators in them, or decimal separators that aren't the . (in many locales it's ,), etc., etc.
Also, an empty string will evaluate as a number, won't it?
@T.J.Crowder again good call. I made the change you suggested.
@KJPrice According to the examples on MDN the empty string is converted to 0 which is not NaN
Ah, @jpw good call. When testing isNaN('') it returned false and my brain short-circuited by the double negative. You are totally right.
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.