adding 2 text inputs to fill another

**Mk4d** · 09-27-2012 07:01 AM

Been looking around the internet and cannot seem to word my question good enough to produce anything close to what I want to do. I wrote a form for use at a golf course I work at. It is a form for keeping pesticide records. I am trying to figure out how to get in to mutiply 2 text input boxes together and autofill other ones with the result.

I have to input ounces of chemical used per 1000 ft²
I have to input acres sprayed

I would like to have the form autofill sections for Amount of chemical used per acre and total amount of chemical used. I know all the math involved I just can't figure out how to make it do it in html. I can post my code if needed.

**ZABI** · 09-27-2012 07:43 AM

posting your code will help to slove the problem;

**Mk4d** · 09-27-2012 08:03 AM

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://dublincore.org">
<title>Pesticide Record Form</title>
<meta name="Author" content="Michael L. Ford" />

<style type="text/css">
/* This is an embedded style area */

Body

{
background-image: url(grainblue.jpg);
background-color: #c5dae3;
color: #000000;
}


h1, h2, h3, h4, h5, h6

{
color: #666666;
}

td {
background-color:white;
color:black;
}

th {
background-color:white;
}

input
{
color:red;
}

select
{
color:red;
}

</style>

</head>
<body>

<p align="center"><font size="6"><b><br />Pesticide Records Form</b></font><br /> </p>



<form action="formmail.php">

<table border="1" width="99%" cellspacing="1" cellpadding="12" align="center">

<tr>
<th colspan="2">Brand Name/ Formulation</th>
<th>EPA Reg. #</th>
<th>Amount per <br />1000 FT²</th>
<th>Amount per <br />Acre</th>
<th>Total amount <br />Used</th>
</tr>
<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>

<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>

<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>

<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>

<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>

<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>



<tr>
<td valign="top" colspan="2"><font size="3"><b><u>Applicator's Licence Number:</u></b></font>

<select>
<option></option>
<option></option>
<option></option>
<option></option>
</select>

</td>

<td valign="top" colspan="2"><font size="3"><b><u>Applicators's Name:</u></b></font>

<select>
<option></option>
<option></option>
<option></option>
<option></option>
</select>

</td>
<td valign="top" colspan="2"><font size="3"><b><u>Applicator's Signature:</u></b></font></td>
</tr>



<tr>
<td colspan="6"><b><u>Target area:</u></b>

<select>
<option>Green's</option>
<option>Green's & Collars</option>
<option>Tee's</option>
<option>Fairways</option>
<option>Rough</option>
<option>Other</option>
</select>

<b><u>Unit:</u></b>
<select>
<option>Multipro 1250</option>
<option>Kabota 5400</option>
<option>Cushman</option>
<option>Backpack</option>
</select>

 

<b><u>PSI:</u></b>
<select>
<option>40</option>
<option>42</option>
<option>44</option>
<option>46</option>
<option>48</option>
<option>50</option>
<option>52</option>
<option>54</option>
<option>56</option>
<option>58</option>
<option>60</option>
<option>62</option>
</select>

 

<b><u>Speed/RPMS:</u></b>
<select>
<option>1 mph</option>
<option>2 mph</option>
<option>3 mph</option>
<option>4 mph</option>
<option>5 mph</option>
<option>6 mph</option>
<option>7 mph</option>
<option>8 mph</option>
<option>1000 RPM</option>
<option>1100 RPM</option>
<option>1200 RPM</option>
<option>1300 RPM</option>
<option>1400 RPM</option>
<option>1500 RPM</option>
<option>1600 RPM</option>
<option>1700 RPM</option>
<option>1800 RPM</option>
<option>1900 RPM</option>
<option>2000 RPM</option>
</select>

 

<b><u>Gear:</u></b>
<select>
<option>1st</option>
<option>2nd</option>
<option>3rd</option>
<option>4th</option>
</select>

 

<b><u>Total Gallons Used:<input type="text" size="15" /></u></b>

</td>
</tr>



<tr>
<td valign="top" align="center" colspan="3"><b><u>Application Date:</u></b><br />


<select>
<option>January</option>
<option>February</option>
<option>March</option>
<option>April</option>
<option>May</option>
<option>June</option>
<option>July</option>
<option>August</option>
<option>September</option>
<option>October</option>
<option>November</option>
<option>December</option>
</select>



<select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
<option>23</option>
<option>24</option>
<option>25</option>
<option>26</option>
<option>27</option>
<option>28</option>
<option>29</option>
<option>30</option>
<option>31</option>
</select>



<select>
<option>2012</option>
<option>2013</option>
<option>2014</option>
<option>2015</option>
<option>2016</option>
<option>2017</option>
<option>2018</option>
<option>2019</option>
<option>2020</option>
</select>
</td>



<td valign="top" align="center" colspan="3"><b><U>Wind Direction:</u></b>

                   

<b><u>Wind Speed:</u></b><br />


<select>
<option>North</option>
<option>North East</option>
<option>East</option>
<option>South East</option>
<option>South</option>
<option>South West</option>
<option>West</option>
<option>North West</option>
</select>

                   



<select>
<option>0-5 MPH</option>
<option>5-10 MPH</option>
<option>10-15 MPH</option>
<option>15-20 MPH</option>
<option>20-25 MPH</option>
</select>

</td>
</tr>



<tr>
<td valign="middle" align="center" colspan="3"><b><u>Units Treated:</u></b><br />
<b>Acres:</b><input type="text" size="15" />
<b>FT²:</b><input type="text" size="15" />
</td>



<td valign="middle" align="center" colspan="3"><b>Time Started:</b>

                   

<b>Time Completed:</b><br />

<input type="text" size="15" />

<select>
<option>AM</option>
<option>PM</option>
</select>

<input type="text" size="15" />

<select>
<option>AM</option>
<option>PM</option>
</select>

</td>
</tr>



<tr>
<td valign="middle" align="center" colspan="3"><b><u>Temperature:</u></b>

                       

<b><u>Humidity</u></b><br />

<input type="text" size="1" /><b>º Farenheit</b>

             

<input type="text" size="1" /><b>%</b>

</td>
<td valign="middle" align="center" colspan="3"><b><u>Notes:</u></b>

                           

<b><u>Estimated Cost:</u></b><br />

<input type="text" size="45" />

           

<b>$</b>

<input type="text" size="15" />

</td>
</tr>



<tr>
<td valign="middle" align="center" colspan="6"><b><img src="imgLg_burl-oaks-golf-course.jpg" alt="map" height="80%" width="100%" /></b></td>
</tr>
</table>

</form>
</body>
</html>

**Mk4d** · 09-27-2012 08:07 AM

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://dublincore.org">
<title>Pesticide Record Form</title>
<meta name="Author" content="Michael L. Ford" />

<style type="text/css">
/* This is an embedded style area */

Body

{
background-image: url(grainblue.jpg);
background-color: #c5dae3;
color: #000000;
}


h1, h2, h3, h4, h5, h6

{
color: #666666;
}

td {
background-color:white;
color:black;
}

th {
background-color:white;
}

input
{
color:red;
}

select
{
color:red;
}

</style>

</head>
<body>

<p align="center"><font size="6"><b><br />Pesticide Records Form</b></font><br /> </p>



<form action="formmail.php">

<table border="1" width="99%" cellspacing="1" cellpadding="12" align="center">

<tr>
<th colspan="2">Brand Name/ Formulation</th>
<th>EPA Reg. #</th>
<th>Amount per <br />1000 FT²</th>
<th>Amount per <br />Acre</th>
<th>Total amount <br />Used</th>
</tr>
<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>

<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>

<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>

<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>

<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>

<tr>
<td colspan="2"><b><input type="text" size="45" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
<td><b><input type="text" /></b></td>
</tr>



<tr>
<td valign="top" colspan="2"><font size="3"><b><u>Applicator's Licence Number:</u></b></font>

<select>
<option></option>
<option></option>
<option></option>
<option></option>
</select>

</td>

<td valign="top" colspan="2"><font size="3"><b><u>Applicators's Name:</u></b></font>

<select>
<option></option>
<option></option>
<option></option>
<option></option>
</select>

</td>
<td valign="top" colspan="2"><font size="3"><b><u>Applicator's Signature:</u></b></font></td>
</tr>



<tr>
<td colspan="6"><b><u>Target area:</u></b>

<select>
<option>Green's</option>
<option>Green's & Collars</option>
<option>Tee's</option>
<option>Fairways</option>
<option>Rough</option>
<option>Other</option>
</select>

<b><u>Unit:</u></b>
<select>
<option>Multipro 1250</option>
<option>Kabota 5400</option>
<option>Cushman</option>
<option>Backpack</option>
</select>

 

<b><u>PSI:</u></b>
<select>
<option>40</option>
<option>42</option>
<option>44</option>
<option>46</option>
<option>48</option>
<option>50</option>
<option>52</option>
<option>54</option>
<option>56</option>
<option>58</option>
<option>60</option>
<option>62</option>
</select>

 

<b><u>Speed/RPMS:</u></b>
<select>
<option>1 mph</option>
<option>2 mph</option>
<option>3 mph</option>
<option>4 mph</option>
<option>5 mph</option>
<option>6 mph</option>
<option>7 mph</option>
<option>8 mph</option>
<option>1000 RPM</option>
<option>1100 RPM</option>
<option>1200 RPM</option>
<option>1300 RPM</option>
<option>1400 RPM</option>
<option>1500 RPM</option>
<option>1600 RPM</option>
<option>1700 RPM</option>
<option>1800 RPM</option>
<option>1900 RPM</option>
<option>2000 RPM</option>
</select>

 

<b><u>Gear:</u></b>
<select>
<option>1st</option>
<option>2nd</option>
<option>3rd</option>
<option>4th</option>
</select>

 

<b><u>Total Gallons Used:<input type="text" size="15" /></u></b>

</td>
</tr>



<tr>
<td valign="top" align="center" colspan="3"><b><u>Application Date:</u></b><br />


<select>
<option>January</option>
<option>February</option>
<option>March</option>
<option>April</option>
<option>May</option>
<option>June</option>
<option>July</option>
<option>August</option>
<option>September</option>
<option>October</option>
<option>November</option>
<option>December</option>
</select>



<select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
<option>23</option>
<option>24</option>
<option>25</option>
<option>26</option>
<option>27</option>
<option>28</option>
<option>29</option>
<option>30</option>
<option>31</option>
</select>



<select>
<option>2012</option>
<option>2013</option>
<option>2014</option>
<option>2015</option>
<option>2016</option>
<option>2017</option>
<option>2018</option>
<option>2019</option>
<option>2020</option>
</select>
</td>



<td valign="top" align="center" colspan="3"><b><U>Wind Direction:</u></b>

                   

<b><u>Wind Speed:</u></b><br />


<select>
<option>North</option>
<option>North East</option>
<option>East</option>
<option>South East</option>
<option>South</option>
<option>South West</option>
<option>West</option>
<option>North West</option>
</select>

                   



<select>
<option>0-5 MPH</option>
<option>5-10 MPH</option>
<option>10-15 MPH</option>
<option>15-20 MPH</option>
<option>20-25 MPH</option>
</select>

</td>
</tr>



<tr>
<td valign="middle" align="center" colspan="3"><b><u>Units Treated:</u></b><br />
<b>Acres:</b><input type="text" size="15" />
<b>FT²:</b><input type="text" size="15" />
</td>



<td valign="middle" align="center" colspan="3"><b>Time Started:</b>

                   

<b>Time Completed:</b><br />

<input type="text" size="15" />

<select>
<option>AM</option>
<option>PM</option>
</select>

<input type="text" size="15" />

<select>
<option>AM</option>
<option>PM</option>
</select>

</td>
</tr>



<tr>
<td valign="middle" align="center" colspan="3"><b><u>Temperature:</u></b>

                       

<b><u>Humidity</u></b><br />

<input type="text" size="1" /><b>º Farenheit</b>

             

<input type="text" size="1" /><b>%</b>

</td>
<td valign="middle" align="center" colspan="3"><b><u>Notes:</u></b>

                           

<b><u>Estimated Cost:</u></b><br />

<input type="text" size="45" />

           

<b>$</b>

<input type="text" size="15" />

</td>
</tr>



<tr>
<td valign="middle" align="center" colspan="6"><b><img src="imgLg_burl-oaks-golf-course.jpg" alt="map" height="80%" width="100%" /></b></td>
</tr>
</table>

</form>
</body>
</html>

**ZABI** · 09-28-2012 12:46 AM

here is the basic idea

<form name="form">
<input type="text" name="field1" onKeyUp="form.field3.value=(form.field1.value*form.field2.value);" />
*
<input type="text" name="field2" onKeyUp="form.field3.value=(form.field1.value*form.field2.value);" />
=
<input type="text" name="field3" />
</form>

**Mk4d** · 09-29-2012 04:12 PM

Finally got a chance to work on this works great, thanks much. I do have a few more questions I cant seem to figure out. I have been working with the general idea code you gave me and have most of it dialed in. What would be the symbol for divide? Is it / or is that recognized as a html slash? My other question is can I double up the code on one line to have the same field effect 2 fields in different manners? I have tried a few different ways and none seem to work.

This is kinda what I mean.

<input type="text" name="field1" onKeyUp="form.field3.value=(form.field1.value*form.field2.value);" onKeyUp="form.field4.value=(form.field1.value+form.field5.value);"/>

It still does the firs part of the code but it seems like its skipping or not even process the second calculation.

**ZABI** · 10-01-2012 12:28 AM

as you have many fields on your page and naming them field1,2,3 etc... will increase confusion. so best ideas is to name those fields descriptively. for example amount_per_1000ft1, amount_per_1000ft2 etc...
then you can calculate easily for every item.

symbols are for division is / for more http://www.w3schools.com/js/js_operators.asp

**ZABI** · 10-01-2012 12:28 AM

as you have many fields on your page and naming them field1,2,3 etc... will increase confusion. so best ideas is to name those fields descriptively. for example amount_per_1000ft1, amount_per_1000ft2 etc...
then you can calculate easily for every item.

symbols are for division is / for more http://www.w3schools.com/js/js_operators.asp

**Mk4d** · 01-29-2013 03:06 PM

Working out a few bugs on this form based on input from the people who use it. One thing I am having issues with is I need to add letters in the same text input field after the number and I keep getting NaN as the formula result. I am guessing that this means "not a number". Is there something I can do to have it ignore the letters in the formulation?

Thread: adding 2 text inputs to fill another

Thread Tools

Display

adding 2 text inputs to fill another

Code

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions