Solved

Help subtracting two numbers and showing result in form field.

Posted on 2002-07-29
8
219 Views
Last Modified: 2008-03-06
I am working on form. The following is just a part of the form. The user will enter two numbers say Num1 and Num2. I want to actively show the result in a readonly text field. How can I do this using javascript? There are other fields in the form too so I don't want to lose their value if I have to reload. Any help will be appreciated. I am also using cold fusion.

Thanks!

0
Comment
Question by:algomez
  • 4
  • 2
  • 2
8 Comments
 
LVL 14

Expert Comment

by:avner
ID: 7184692
<html>
<head>
<title>new Documet </title>
<script>
<!--(c)Avner Cohen [avcoh@yahoo.com]

-->
</script>
<style>

</style>
</head>

<body>
<FORM>
<BUTTON onclick="this.form.value3.value=(this.form.value1.value-this.form.value2.value)">Calculate</BUTTON><BR/>
Value 1 :<input type="text" name="value1" value="1111">
<BR/>Value 2 :<input type="text" name="value2" value="563">
<BR/>Result  :<input type="text" name="value3" value="" DISABLED="TRUE" READONLY="TRUE">

</body>
</html>
0
 

Author Comment

by:algomez
ID: 7184788
This is very close to what I want but is there a away to not have to use the button to get the answer? The reason being that this subtraction is just part of a bigger form with other text fields.  If I am the user I will enter a value in the first num field , then enter the second number and when I click anywhere else on the form the readonly field displays the answer...?

Thanks alot!!!
0
 

Author Comment

by:algomez
ID: 7184789
This is very close to what I want but is there a away to not have to use the button to get the answer? The reason being that this subtraction is just part of a bigger form with other text fields.  If I am the user I will enter a value in the first num field , then enter the second number and when I click anywhere else on the form the readonly field displays the answer...?

Thanks alot!!!
0
Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
LVL 14

Accepted Solution

by:
avner earned 100 total points
ID: 7184797
Use this to make it work when you click anywhere on the screen :
<html>
<head>
<title>new Documet </title>
<script>
<!--(c)Avner Cohen [avcoh@yahoo.com]

-->
</script>
<style>

</style>
</head>

<body onclick="document.forms[0].value3.value=(document.forms[0].value1.value-document.forms[0].value2.value)">
<FORM>
<BR/>
Value 1 :<input type="text" name="value1" value="1111">
<BR/>Value 2 :<input type="text" name="value2" value="563">
<BR/>Result  :<input type="text" name="value3" value="" DISABLED="TRUE" READONLY="TRUE">

</body>
</html>
0
 

Author Comment

by:algomez
ID: 7185500
This is very close to what I want but is there a away to not have to use the button to get the answer? The reason being that this subtraction is just part of a bigger form with other text fields.  If I am the user I will enter a value in the first num field , then enter the second number and when I click anywhere else on the form the readonly field displays the answer...?

Thanks alot!!!
0
 

Author Comment

by:algomez
ID: 7185510
Thanks! Exactly what I need!

0
 
LVL 5

Expert Comment

by:CFXPERT
ID: 7185543
Try this out:

<html>
<head>
     <title>Untitled</title>
<script language="javascript">
function subtract(){
result.value = (num1.value - num2.value)
}
</script>
</head>

<body>
num1:<input type="text" name="num1" value="0"><br>
num2:<input type="text" name="num2" onChange="subtract()" value="0"><br>
otherField:<input type="text" name="other" value="click here"><br>
result:<input type="text" readonly name="result">
</body>
</html>
0
 
LVL 5

Expert Comment

by:CFXPERT
ID: 7185548
never mind.  I was typing while you must have accepted his answer.

0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In this article, we'll look how to sort an Array in JavaScript, including the more advanced techniques of sorting a collection of records either ascending or descending on two or more fields. Basic Sorting of Arrays First, let's look at the …
Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

808 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question