Doing simple math

Johnny · Jun 24, 2004

I'm creating a Web page on which I want to do some math, and I'm pretty
sure it's best don with Javascript, but I have no idea where to get
started. Here's the deal.

I want to allow the user to enter a number and click "Go," at which
point a table would be updated to show the result of multiplying that
number by certain constants.

For example, if the user enters 20, the table would multiply 20 by the
constant $10.00 and display the product, $200.00, in the appropriate
cell. The table would also multiply 20 by the constant $5.00 and display
that product, $100.00, in its appropriate cell. This needs to take place
in a total of four cells, so the result would be four new products based
on the multiplier of 20.

If the user then entered, say, 30, all of the four cells would be
updated to show the product of each constant multiplied by 30 instead of
20.

You can see how I hope to implement this idea at
http://teelinstitute.org/suledo/costsandorderforms_test.htm. The table
is meant to look more or less like it would if the user could choose any
multiplier. The list of four constants is shown in the "per student"
column.

If you have any ideas I'd appreciate knowing them, and thanks.

--Johnny
johnnyg aattssiiggnn kc.rr.com

Vincent van Beveren · Jun 25, 2004

I want to allow the user to enter a number and click "Go," at which

point a table would be updated to show the result of multiplying that
number by certain constants.

Yes, this can be done with JS.

There a few key elements you need to use.

First you need to make an input in HTML:

<INPUT TYPE="TEXT" SIZE="4" ID="students" VALUE="">
<INPUT TYPE="BUTTON" VALUE=" Ok " onClick="calc();">

Notice how onClick calls a JavaScript function 'calc'. We'll get back to
that later.

Now you need to assign some parts in the document where the content
will be dynamically changed. You can do this in several ways, I usually
do it by assiging an ID to it. In your case the following might be
the easiest:

<td align="right">
<font face="Courier">
<span id="kCell">$0</span>
</font>
</td>

Now you need to assign a unique ID to each element you want to change
dynamically.

So, maybe kCell, 1stCell etc...

but it can basically be anything you want.

Now you need to write some JavaScript. usually this would be located
between the head tags.

<HEAD> ... other content...
<SCRIPT LANGUAGE="JavaScript">

.. code comes here ..

</SCRIPT>
</HEAD>

We need to write the function calc between the script tags, that is
declared in the following way:

function calc()
{
.. calculation comes here ..
}

first thing is to retrieve the value of the amount. I usually do this
with

document.getElementById('students').value;

in which document has a function getElementById in which I can request
a element in the document by its ID. Now we need to have the value of
that element, thus comes the statement down here.

stud = docment.getElementById('students').value;

Puts the number in the stud variable.

The rest is not too complecated, for each element, do the following
with the correct variables and multipliers.

document.getElementById('kCell').innerHTML='$'+(stud*10)+'.00';

And you should have your working page. If you have any questions let me
know.

Good luck,
Vincent

Johnny · Jun 26, 2004

Thanks for all the time you took to educate me. I learned a lot.

Even basic math is at risk? Why is a simple math and logic solution being ignored?	2	Jul 3, 2025
SENTINEL CONTROL LOOP WHEN DEALING WITH TWO ARRAYS	1	Oct 26, 2023
[C++] Pointers declared inside a function, how do I manage them?	5	May 3, 2023
Search Results with Pagination	1	Oct 25, 2024
doing math with html	10	May 22, 2007
Online Math Coding Contest	0	Jan 5, 2010
Online Math Coding Contest	0	Jan 5, 2010
efficient vector math...	13	Nov 29, 2010

Doing simple math

Johnny

Vincent van Beveren

Johnny

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads