Code Salty: number textbox

Showing posts with label number textbox. Show all posts

Monday, 8 October 2012

TextBox only allows numbers/numerics

A Lot of javascript functions to assist you

function isNumber(n) {

return !isNaN(parseFloat(n)) && isFinite(n);

}

OR

Html

Javascript

var input = document.getElementById('numbersOnly');

input.onkeydown = function(e) {

var k = e.which;

/* numeric inputs can come from the keypad or the numeric row at the top */

if ( (k < 48 || k > 57) && (k < 96 || k > 105)) {

e.preventDefault();

return false;

}

</script>

OR

Html

<input type="text" onKeyUp="numericFilter(this);" />

 <script language="JavaScript" type="text/javascript">

Javascript

function numericFilter(txb){

        txb.value =txb.value.replace(/[^\0-9]/ig, "");

 </script>

textbox reads only numeric key strokes

<HTML>
<HEAD>
<TITLE>Allow Only Numbers
</HEAD>

<BODY>
<script language="JavaScript">
function onlyNumbers(evt)
{
 var e = event || evt; // for trans-browser compatibility
 var charCode = e.which || e.keyCode;

 if (charCode > 31 && (charCode < 48 || charCode > 57))
  return false;

 return true;

}
</script>
<input type="text" onkeypress="return onlyNumbers();">
</BODY>
</HTML>

Not so smart. This doesn't allow for the shift key being pressed, so allows any of !"£$%^&*() as well as any numeric.
Obviously (??) the onKeyDown etc doesnt detect Shift1 etc.
So as a validation before assigning to a numeric field then this just doesnt work.The problem with the shift key can be fixed as follows :

{

 var e = event || evt; // for trans-browser compatibility
 var charCode = e.which || e.keyCode;
 if (charCode > 31 && (charCode < 48 || charCode > 57))
  return false;
                if (e.shiftkey) return false;
 return true;
}
 The down side of this is that it efectively disables the numeric key pay because the Num Lock sets the shift key.

<HTML>
   <HEAD>
   <SCRIPT language=Javascript>
      <!--
      function isNumberKey(evt)
      {
         var charCode = (evt.which) ? evt.which : event.keyCode
         if (charCode > 31 && (charCode < 48 || charCode > 57))
            return false;

         return true;
      }
      //-->
   </SCRIPT>
   </HEAD>
   <BODY>
      <INPUT id="txtChar" onkeypress="return isNumberKey(event)" type="text" name="txtChar">
   </BODY>
</HTML>

Saturday, 6 October 2012

How do I make a textbox that only accepts numbers

1. Html/ Jsp textbox which only allow numbers

2. Only numbers allowed in textbox

3. How can I use javascript to allow only numbers to be entered in a textbox

4. Allow only Numbers in a Textbox

5. Textbox number validation

//Javascript code below

function numbersOnly(myfield, e)

{

var key;

var keychar;

if (window.event)

key = window.event.keyCode;

else if (e)

key = e.which;

else

return true;

keychar = String.fromCharCode(key);

// control keys

if ((key==null) || (key==0) || (key==8) ||

(key==9) || (key==13) || (key==27) )

return true;

// numbers

else if ((("0123456789.").indexOf(keychar) > -1))

return true;

// decimal point jump

else

return false;

}

// JSP code

use the above javascript function @ onKeyPress event like below

<s:textfield name="textbox1" id=" textbox1" maxlength="20" onkeypress="return numbersOnly(this, event);" />

// <s:textfield> is a struts tag. Html <input> tag can also be used.

Code Salty

Pages

Monday, 8 October 2012

TextBox only allows numbers/numerics

textbox reads only numeric key strokes

Saturday, 6 October 2012

How do I make a textbox that only accepts numbers

About Me