Link to home
Start Free TrialLog in
Avatar of minglelinch

asked on

A Validation Style

I want my user input validation like this:

For digits fields, if a user enter a charcter, the box still stays empty. The box show values only digits are entered.

For decimal fields, the box only accepts decimal format otherwise the box stays empty.

How can I achive the purpose? Thanks.
Avatar of guvera
Flag of India image

Link to home
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
use javascrpit
   <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;
      <INPUT id="txtChar" onkeypress="return isNumberKey(event)" type="text" name="txtChar">

And smilarly for decimal filed!! Try this .
for decimals
<script language="JavaScript" type="text/javascript">
function zxcFloat(obj){
and call this function  
<INPUT id="txtChar" onblur="zxcFloat(this)" type="text" name="txtChar">

Use client side scrpting as when user press key to enter it checks ,if invalid it remains empty . And also in decimal if user enter decimal two times ,second decimal deleted as user move the cursor from textbox. Try. And for message you n give alert or document.getelementid() etc.
Avatar of minglelinch


Thank you all. All answers are great.

isNumberKey is working fine for digit entry.
For decimal entery, isDecimalKey is working fine (the entry only accepts digits and dot), but when furhter checking the format at onblur or lostfocus event, the function seems like not firing at all.
I used -
 function isDecimalKey(evt)
         var charCode = (evt.which) ? evt.which : event.keyCode
         if (charCode > 31 && ((charCode < 48 && charCode != 46) || charCode > 57))
            return false;
         return true;
function isDecimalFormatMatch()
    var txtWDLost= document.getelementid("txtWDLost").value;
      if (txtWDLost.value.tostring().match(/^\d+\.\d{2}$/)) {
            return true; //alert("match");
          alert("Invalid format.");
            //return false;

<asp:TextBox ID="txtWDLost" runat="server" Width="190px" onkeypress="return isDecimalKey(event)" type="text" name="txtWDLost" onblur="return isDecimalFormatMatch()">

hey minglelinch:
I have tried this javascript ... onKeyUp event.
check this also.It even obstructs user to write second dot .

<script language="JavaScript">
  function Decimal( evt ) {
    var msg=evt.value; 
    var w;
    var str=msg.indexOf( "." );
    var ind;
      for ( w=0; w<msg.length; w++ )  {
      if ( ind<"0" || ind>"9" )  {
           if ( str>0 )
             if ( w==str )  continue;    
<title>Decimal check</title>
<form name="form1" method="post" action="gonder.html">
  <input name="Txt01" type="text" value="" size="30" onKeyUp="Decimal(this)"><br>

Open in new window

Hey anurag_onnet:

I tested you code above. It's short and it's working fine except it accepts multple digits after dot.

I used the last version of MaskMoney function in the link you gave me. It's a nice one too.

Thank you. Happy New Year!
Link to home
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Thank you, anurag_onnet. I tested it and it's working as you described. I will use it in the future.