Can't determine whether form field contains a number

Dev Shed Forums Sponsor:

July 7th, 2007, 02:45 PM

doctormelodious

Contributing User

Join Date: Aug 2003

Posts: 122

Time spent in forums: 1 Day 9 h 9 m 2 sec
Reputation Power: 64

Can't determine whether form field contains a number

Greetings,

I am trying to validate an HTML form field, to make sure it contains a number.

In Attempt #1, even when the field contains a number, JavaScript interprets it as a string:

Code:

/*ATTEMPT #1*/

function validateProdNum(prodNumField){
	if(typeof prodNumField.value != "number"){
		alert('Production Number must be a number');
		return false;
	}
	else{return true}
}

In Attempt #2, if the field doesn't contain a number, the "alert" says "NaN," but my attempt to test for that in the "if" statement doesn't work. JavaScript thinks it IS a number, and returns TRUE:

Code:

/*ATTEMPT #2*/

function validateProdNum(prodNumField){
	alert(prodNumField.value/1)
	if(prodNumField.value/1 == "NaN"){
		alert('Production Number must be a number');
		prodNumField.focus();
		prodNumField.select();
		return false;
	}
	else{return true}
}

How can I make this work??

Thanks!
DM

July 7th, 2007, 03:47 PM

Kravvitz

CSS & JS/DOM Adept

Dev Shed God 30th Plane (19500 - 19999 posts)

Join Date: Jul 2004

Location: USA

Posts: 19,834

Time spent in forums: 6 Months 1 Day 21 h 3 m 17 sec
Reputation Power: 4192

The values of form controls are always strings. In JavaScript a string will be automatically converted to a number if you try to subtract, multiply, or divide it by a number. (Adding doesn't work because the addition operator plays double duty as the concatenation operator.)

You can use Number() to convert a string to a number and to check if the result is a number or not, you must use the isNaN() function.

Code:

if(isNaN(Number(prodNumField.value))){

Number() will convert an empty string or a string containing only whitespace characters to 0, so since you need to test for that possibility as well, you might as well just do the whole check with a regular expression.

Code:

function isValidNumber(str) {return (/^(\d[\d\.]+|\.?\d)$/.test(str));}

if(!isValidNumber(prodNumField.value)){

__________________
Spreading knowledge, one newbie at a time. I'm available for hire at Dynamic Site Solutions.

Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

Remember people spend most of their time on other people's sites (so don't violate web design conventions).

July 7th, 2007, 04:34 PM

doctormelodious

Contributing User

Join Date: Aug 2003

Posts: 122

Time spent in forums: 1 Day 9 h 9 m 2 sec
Reputation Power: 64

Thanks Kravvitz!

Can't determine whether form field contains a number

Developer Shed Advertisers and Affiliates