AJAX

Javascript change text box fields

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases

Thread Solved

•

Join Date: Jan 2008

Posts: 62

Reputation: hooray is an unknown quantity at this point

Solved Threads: 6

hooray

Offline

Junior Poster in Training

Javascript change text box fields

May 23rd, 2008

Hi guys,

I am trying to make a javascript function that will add "000" to the end of a textbox value if the user presses k and also add "000000" if they press m. So i don't want the k or m to appear in the textbox and some 0's to appear instead. If anyone could help me out with some code id be very grateful.

Thanks everyone

This is where I am at now (Ive done the easy bit, cant find out about detecting if k or m is pressed)

 Help with Code Tags 
 javascript Syntax (Toggle Plain Text) 
function addZero(x) {
if//I dont know how to find out if it is a k or m
{
x.value += 000;
}
}
function addZero(x) {
if//I dont know how to find out if it is a k or m
{
x.value += 000;
}
}

Last edited by peter_budo; May 24th, 2008 at 7:57 pm. Reason: Corecting closing tag

•

Join Date: Jun 2006

Posts: 7,609

Reputation: ~s.o.s~ has much to be proud of

Solved Threads: 464

~s.o.s~

Offline

Failure as a human

Re: Javascript change text box fields

May 24th, 2008

A simple script like this should do the job. Do keep it mind that it can be made better in a lot of ways but for your purpose it should serve well enough:

 Help with Code Tags 
 JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv"Script-Content-Type" content="text/javascript">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="Expires" content="0"> <!-- disable caching -->
    <title>Example</title>
    <script type="text/javascript">
    function handleAutoAppend(e) {
      // A mapping which maintains a list of what needs to be appended for
      // which key pressed by the user.
      var mappings = {k : "000", m: "000000"};
 
      // Process the event triggered by the user and grab hold of the element
      // on which it was triggered along with the pressed keys' value
      e = e || window.event;
      var code = e.which || e.keyCode;
      var key = String.fromCharCode(code);
      var elem = e.srcElement || e.target;
 
      // For each 'value' of our interest, append the requisite string at the 
      // end of the existing text and return(false) so as not the render 'k'
      // or 'm'
      for(var k in mappings) {
        if(key == k) {
          var val = mappings[k];
          if(elem) {
            elem.value = elem.value + val;
            return(false);
          }
        }
      }
 
      // For all other keys, don't do anything; allow the default behavior 
      // to take over.
      return(true);
    }
    </script>
</head>
<body>
  <form id="frm" name="frm" action="#">
    <p>Enter something:</p>
    <input type="text" name="txt" id="txt" onkeypress="return handleAutoAppend(event);">
  </form>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv"Script-Content-Type" content="text/javascript">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="Expires" content="0"> <!-- disable caching -->
    <title>Example</title>
    <script type="text/javascript">
    function handleAutoAppend(e) {
      // A mapping which maintains a list of what needs to be appended for
      // which key pressed by the user.
      var mappings = {k : "000", m: "000000"};
      
      // Process the event triggered by the user and grab hold of the element
      // on which it was triggered along with the pressed keys' value
      e = e || window.event;
      var code = e.which || e.keyCode;
      var key = String.fromCharCode(code);
      var elem = e.srcElement || e.target;
      
      // For each 'value' of our interest, append the requisite string at the 
      // end of the existing text and return(false) so as not the render 'k'
      // or 'm'
      for(var k in mappings) {
        if(key == k) {
          var val = mappings[k];
          if(elem) {
            elem.value = elem.value + val;
            return(false);
          }
        }
      }
      
      // For all other keys, don't do anything; allow the default behavior 
      // to take over.
      return(true);
    }
    </script>
</head>
<body>
  <form id="frm" name="frm" action="#">
    <p>Enter something:</p>
    <input type="text" name="txt" id="txt" onkeypress="return handleAutoAppend(event);">
  </form>
</body>
</html>