Keypress()

JavaScript
1

I’m trying to produce the same value (for now) when I input something in one text I want it to show up in the other text box, but right now it’s showing one less value… this is the present code


<script>
	$('#effective').keypress(function(){ 	
		 var value1 = $(this).val();	 
		 $('#nominal').attr('value',value1)
	});
</script>

This is what it produces, one less digit,

then when I start to remove texts it the second text box doesn’t adjust values accordingly. It remains what it was.

if keypress() is not a good option to serve this purpose, please let me know what would be… Thanks for reading and help.

2

okay I think keyup() is the solution for now.

I also changed

$(‘#nominal’).attr(‘value’,value1)
to
$(‘#nominal’).val(value1);

the first one adds value to the value attribute but don’t know where the value gets preserved for the second one.

3

Hi,

From the screenshot, it looks like your trying to sync inputs of the type=“number”.

If so, this should work:

<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Sync input</title>
  </head>
  
  <body>
    <input id="one" type="number" />
    <input id="two" type="number" />
    
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script>
      function syncBox(){
        $("#two").val($("#one").val());
      }
      
      $("#one").on({
        keyup: syncBox,
        change: syncBox
      });
    </script>
  </body>
</html>

You have to respond to the change event for when you click the arrows to increase and decrease the value.
You have to respond to the keyup event for when someone is typing in the box.

HTH

1 Like