PDA

Click to See Complete Forum and Search --> : accept only numeric values text field

SunCore
February 22nd, 2006, 04:54 AM
does someone have any idea how can i accept only numeric values in a text field?

thanks in advance
PeejAvery
February 22nd, 2006, 06:59 AM
does someone have any idea how can i accept only numeric values in a text field?
Just use isNaN() (http://www.w3schools.com/jsref/jsref_isNaN.asp) to validate it.
SunCore
February 22nd, 2006, 07:21 AM
i don't want to validate it.
i don't want the user to be able yo type not numeric values in the text field.
PeejAvery
February 22nd, 2006, 07:25 AM
i don't want to validate it.
i don't want the user to be able yo type not numeric values in the text field.
So then you will still have to use isNaN() but every keystroke will have to be validated. Either way, you have to validate to keep those keystroke.
HanneSThEGreaT
February 22nd, 2006, 08:06 AM
Have a look at this sample, I quickly made for you.
Note this is in JS
<HTML>

<HEAD>
<TITLE>Music Preferences Survey</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!-- hide JS code
function validateForm(form) // validate Survey data
{
if (!validateFirstName(form.firstName.value)) // first name valid?
{
form.firstName.focus()
return false
}
if (!validateEMail(form.email.value)) // email valid?
{
form.email.focus()
return false
}
if (!validateNumHours(form.numHours.value)) // hours/day valid?
{
form.numHours.focus()
return false
}
alert("Congratulations: Your data is valid!") // all data valid
return true
}
function validateFirstName(firstName)
{
if (isBlank(firstName)) // first name field blank?
{
alert("Enter your first name, please!")
return false
}
if (firstName.indexOf(" ", 0) != -1) // two names?
{
alert("Enter one name only, please!")
return false
}
return true
}
function isBlank(testStr)
{
if (testStr.length == 0) // nothing entered?
return true
for (var i = 0; i <= testStr.length-1; i++) // all spaces?
if (testStr.charAt(i) != " ")
return false
return true
}
function validateEMail(email)
{
if (isBlank(email)) // email blank?
{
alert("Enter your email address, please!")
return false
}
var atsignPos = email.indexOf("@", 0) // check for @
if (atsignPos == -1)
{
alert("Enter a valid email address with an @, please!")
return false
}
if (email.indexOf(".", atsignPos) == -1) // check for . after @
{
alert("Enter a valid email domain after the @, please!")
return false
}
return true
}
function validateNumHours(numHours)
{
if (isBlank(numHours)) // numHours blank?
{
alert("Enter the number of hours a day you enjoy music, please!")
return false
}
for (var i = 0; i < numHours.length; i++) // numHours numeric?
{
var testChar = numHours.charAt(i)
if (testChar < "0" || testChar > "9")
{
alert("Enter a non-negative integer number of hours, please!")
return false
}
}
if (parseInt(numHours) > 24) // numHours > 24?
{
alert("Sorry, only 24 hours in a day. Try again, please!")
return false
}
return true
}
// end JS hide -->
</SCRIPT>
</HEAD>

<BODY BGCOLOR="black" TEXT="white"
onLoad="window.defaultStatus='Survey Frame'">
<CENTER>
<H2>Music Preferences Survey</H2>
<FORM NAME="surveyForm" >
First Name: <INPUT TYPE="text" NAME="firstName" SIZE="12">
EMail: <INPUT TYPE="text" NAME="email" SIZE="26"><P>
I listen to: <INPUT TYPE="checkbox" NAME="listenPop">pop
<INPUT TYPE="checkbox" NAME="listenFolk">folk
<INPUT TYPE="checkbox" NAME="listenWorld">world
<INPUT TYPE="checkbox" NAME="listenAvant">avant-garde
<INPUT TYPE="checkbox" NAME="listenOther">other<P>
I spend approximately <INPUT TYPE="text" NAME="numHours" SIZE="2"
MAXLENGTH="2"> hours a day enjoying music.<P>
<INPUT TYPE="submit" VALUE="Submit">
<INPUT TYPE="button" VALUE="Validate" onClick="validateForm(this.form)">
<INPUT TYPE="reset" VALUE="Reset">
</FORM>
</CENTER>
</BODY>

</HTML>

PS: I've included some other "fun" stuff for you as well!
Hope it helps!
Asok
February 22nd, 2006, 09:42 AM
Here:


<script language="JavaScript">
function onlyNumsAllowed()
{
var iKeyCode;

iKeyCode = event.keyCode;

//
// If key pressed is not 0 - 9, don't allow it through.
//
if( iKeyCode < 48 || iKeyCode > 57 )
event.keyCode = null;
}
</script>
<input type='text' id='numonly' onkeypress='onlyNumsAllowed()'>


This will ensure that only numbers are entered AS THEY ARE TYPED. :thumb: