input box + regex, small issue

**ripken204** · 03-21-2010, 08:23 PM

I am in the processing of recoding a website and for some reason a small piece of code does not work for me anymore.

this code is for an input text field

Code:

onkeydown="if(this.value.length>1){this.value=this.value.replace(/^(\d{2})(\.*)(\d{0,3})/g, '$1\.$3');};"

basically the user is allowed to type in 4 digits and this code puts a decimal in the middle.

so the format will be ##.##

but what is happening to me now is that if ##.## is in the input box then i can only backspace the last two numbers and it just hangs up on the decimal, i have no idea why.

**JMRKER** · 03-21-2010, 11:03 PM

Untested, but can you try this ...

Code:

onkeydown="if(this.value.length>1){this.value=this.value.replace(/^(\d{2})(\.*)(\d{0,3})/g, '$1$2$3');};"

**ripken204** · 03-21-2010, 11:08 PM

no that isnt even putting the decimal in
i am now just testing this single line of code in an html file.
play with it if you would like.

i can't remember why i did it the way i did since it has been a few years.
i might just write a separate function to handle it, would much rather prefer a simpler way though thru regex.

Code:

<input maxlength="5" size="5" onkeydown="if(this.value.length>1){this.value=this.value.replace(/^(\d{2})(\.*)(\d{0,3})/g, '$1\.$3');};">

**JMRKER** · 03-22-2010, 09:07 AM

Not as tight as your original, but it does handle negative numbers...

Code:

<html>
<head>
<title>Limited Input</title>
<script type="text/javascript">
// From: http://www.dynamicreport.com/1010.php

function  input_filterAmt (str, dec, bNeg) { // auto-correct input - force numeric data based on params.
 var cDec = '.'; // decimal point symbol
 var bDec = false; var val = "";
 var strf = ""; var neg = ""; var i = 0;

 if (str == "") return parseFloat ("0").toFixed (dec);

 if (bNeg && str.charAt (i) == '-') { neg = '-'; i++; }

 for (i; i < str.length; i++) {
  val = str.charAt (i);
  if (val == cDec)  {
    if (!bDec) { strf += val; bDec = true; }
  } else {
    if (val >= '0' && val <= '9') { strf += val; }
  }
  strf = (strf == "" ? 0 : neg + strf);
  return parseFloat (strf).toFixed (dec);
 }
}

</script>
</head>
<!-- From: http://www.webdeveloper.com/forum/showthread.php?p=1076404#post1076404 -->
<body>
<input maxlength="5" size="5" value="" onchange="this.value=input_filterAmt(this.value,2,true)">
</body>
</html>

Good Luck!

**ripken204** · 03-22-2010, 12:55 PM

i want to get it to work onkeydown
so that as you type the decimal is inserted.
my code works fine for typing the number in but wont let me backspace all of it out.
yours also has the backspace issue for onkeydown.

**JMRKER** · 03-22-2010, 02:56 PM

Once the decimal is put into the value, you have no provision to remove it, hence the backspace problem with the onkeydown logic.

The decimal is placed in the output on the way out of the function if you do not type it explicitly.
With the onchange code, you can backspace the decimal out, so I'm not sure what the problem is there.

Here is a revised version of the code:

Code:

<html>
<head>
<title>Limited Input</title>
<script type="text/javascript">
// For: http://www.webdeveloper.com/forum/showthread.php?p=1076404#post1076404 -->
// Modified function from: http://www.dynamicreport.com/1010.php

function  input_filterAmt (str, dec, bNeg) { // auto-correct input - force numeric data based on params.
  var cDec = '.'; // decimal point symbol
  var bDec = false; var val = "";
  var strf = ""; var neg = ""; var i = 0;
  if (str == "") return parseFloat ("0").toFixed (dec);
  if (bNeg && str.charAt (i) == '-') { neg = '-'; i++; }
  for (i; i < str.length; i++) {
    val = str.charAt (i);
    if (val == cDec)  { if (!bDec) { strf += val; bDec = true; } }
                 else { if (val >= '0' && val <= '9') { strf += val; } }
    strf = (strf == "" ? 0 : neg + strf);
  }
  return parseFloat (strf).toFixed (dec);
}
</script>
</head>
<body>
<input maxlength="5" size="5" value="" onchange="this.value=input_filterAmt(this.value,2,true)">
</body>
</html>

**ripken204** · 03-22-2010, 08:12 PM

the issue is that i do not want to do onchange, i want to do it onkeydown.
that way the decimal will actually show as they are typing, so once they have two digits in the decimal automatically goes in.
or they can type in the decimal themselves.

i am essentially having people type seconds and milliseconds into this field

so these are all of the possibilities that they would be able to type in:

Code:

##.##
##.#
##
#.##
#.#
#
.##
.#

now again, the decimal will be forced once two digits are types in, otherwise they can type in the decimal themselves.

**JMRKER** · 03-22-2010, 09:45 PM

Originally Posted by ripken204

the issue is that i do not want to do onchange, i want to do it onkeydown.
...
now again, the decimal will be forced once two digits are types in, otherwise they can type in the decimal themselves.

Well, you can force the decimal to show up
OR
you can backspace to remove it
BUT
not both conditions with the onkeydown event

They are mutually exclusive as far as I can see.

I can attempt some more changes with the "onchange" event,
but if you are adamant about using the "onkeydown", you'll need to show me.

Good Luck!

Thread: input box + regex, small issue

Thread Tools

Display

input box + regex, small issue

Another try ...

Something else to consider ...

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions