Automatically display value in a text box based on the value entered in another text box using javascript

Question

I have 3 text boxes namely textbox1 , textbox2 and textbox3 .

If i enter a numeric value to textbox1 , then automatically textbox2 and textbox3 should display the values textbox1*25 and textbox*75 respectively.

Textbox2 and textbox3 should not be editable and it should be in display mode.

Can anyone help me in finding the solution using javascript.

Thanks in advance, Amith

Answer 1

You need an id in the three elements like id="textbox1", in the textbox1 element, you need an event like onChange="my_func()" so every time you change the value, it jumps to the function:

Then you need the javascript function like:

<script>
function my_func() {
    document.getElementById("textbox2").innerHTML=document.getElementById("textbox1").value*25;
    document.getElementById("textbox3").innerHTML=document.getElementById("textbox1").value*75;
}
</script>

Answer 2

Use the onblur event to check if the input's value is a number using a regular expression. Assign the other input attributes with the same multiplied by 25,75 and set the readOnly value to true.

And do elaborate on what you mean by "Display Mode".

Here is a working sample .

Answer 3

即使我们不是代码工厂，也请尝试以下操作： myExample