Solved

Get form field value using an offset   in a Function

Posted on 2008-06-20
4
421 Views
Last Modified: 2013-11-05
I have a Form created using Perl that has a table with a row for each invoice in a large table. I display all the rows in a table and allow the user to edit some info for each record:

for ($item_cntr = 0; $cntr < $record_cnt; ++$item_cntr)
{ print qq(<tr>
<td><input type="text" name="c_freight_$item_cntr" value="$i_freight[$item_cntr]" onBlur="linetotal($item_cntr)" ></td>
<td><input type="text" name="c_miscamt_$item_cntr" value="$i_miscamt[$item_cntr]" ></td>
<td><input type="text" name="c_price_$item_cntr" value="$i_price[$item_cntr]" ></td>
</tr>);
}

I want to create a Function that is called when they change the Freight value and that causes the rows total Price (freight + miscamt = price) to be calculated again (without hitting a Submit button on the Form).

I created a Function:

function linetotal(whatline) {
var fixed_freight = "document.editform.c_freight_" + whatline;
var fixed_misc = "document.editform.c_miscamt_" + whatline;
var linetotal = parseFloat(fixed_freight.value) + parseFloat(fixed_misc.value);

document.editform.c_price_whatline.value = linetotal; } }

So, if the first row in the table is 0, then the Function is passed "0" and should get the value of the form fields:
'c_freight_0' and 'c_miscamt_0' and set 'c_price_0' to a new value in the form.

The fixed_freight is showing that the string it has is correct, but it does not get the value from the form. Any ideas?
0
Comment
Question by:sverne
  • 2
  • 2
4 Comments
 
LVL 63

Expert Comment

by:Zvonko
ID: 21833796
You create String objects in JavaScript and read the String.value property. That does not work.

Change your onBlur event handler to this: onBlur="linetotal(this)"

Then your script goes like this:
function linetotal(theField) {
  var whatline = theField.name.replace(/\D/g,"");
  var theForm = theField.form;
  var fixed_freight = theField.value;
  var fixed_misc = theForm["c_miscamt_" + whatline].value;
  var total = parseFloat(fixed_freight) + parseFloat(fixed_misc);
  theForm["c_price_"+whatline].value = total.toFixed(2);
}


0
 

Author Comment

by:sverne
ID: 21834459
Error on the fixed_misc line
<html><head>

<script type="text/javascript" language="JavaScript">

function linetotal(theField) {

  var whatline = theField.name.replace(/\D/g,"");

  var theForm = theField.form;

  var fixed_freight = theField.value;

  var fixed_misc = theForm["c_miscamt_" + whatline].value;

  var total = parseFloat(fixed_freight) + parseFloat(fixed_misc);

  theForm["c_price_"+whatline].value = total.toFixed(2); 

}

</script></head><body>
 

<table>

<tr>

<td><input type="text" name="c_invoice_0"  value='123'></td>        

<td><input type="text" name="c_freight_0"  value='1.00' onBlur="linetotal(this)" ></td>        

<td><input type="text" name="c_miscamt_0"     value='2.00'></td>        

<td><input type="text" name="c_price_0"     value='3.00'></td>        

</tr>

<tr>

<td><input type="text" name="c_invoice_1"  value='124'></td>        

<td><input type="text" name="c_freight_1"  value='17.00' onBlur="linetotal(this)" ></td>        

<td><input type="text" name="c_miscamt_1"     value='20.00'></td>        

<td><input type="text" name="c_price_1"     value='37.00'></td>        

</tr>

<tr>

<td><input type="text" name="c_invoice_2"  value='125'></td>        

<td><input type="text" name="c_freight_2"  value='5.00' onBlur="linetotal(this)" > </td>        

<td><input type="text" name="c_miscamt_2"     value='6.00'></td>        

<td><input type="text" name="c_price_2"     value='11.00'></td>        

</tr>

</table></body></html>

Open in new window

0
 
LVL 63

Accepted Solution

by:
Zvonko earned 500 total points
ID: 21835208
Where is your <form> tag?
Put it near the body tag:
<body>
<form>
<table>
...
</table>
</form>
</body>
</html>
0
 

Author Comment

by:sverne
ID: 21835357
Problem resolved and the code is attached below
<html><head>

<script type="text/javascript" language="JavaScript">

function linetotal(theField) {

  var whatline = theField.name.replace(/\D/g,"");

  var theForm = theField.form;

  var fixed_freight = theField.value;

  var fixed_misc = theForm["c_miscamt_" + whatline].value;

  var total = parseFloat(fixed_freight) + parseFloat(fixed_misc);

  theForm["c_price_"+whatline].value = total.toFixed(2); 

}

</script></head><body>

<form method="POST" action="rb_return_create_test.pl" name="editform">
 

<table>

<tr>

<td><input type="text" name="c_invoice_0"  value='123'></td>        

<td><input type="text" name="c_freight_0"  value='1.00' onBlur="linetotal(this)" ></td>        

<td><input type="text" name="c_miscamt_0"     value='2.00'></td>        

<td><input type="text" name="c_price_0"     value='3.00'></td>        

</tr>

<tr>

<td><input type="text" name="c_invoice_1"  value='124'></td>        

<td><input type="text" name="c_freight_1"  value='17.00' onBlur="linetotal(this)" ></td>        

<td><input type="text" name="c_miscamt_1"     value='20.00'></td>        

<td><input type="text" name="c_price_1"     value='37.00'></td>        

</tr>

<tr>

<td><input type="text" name="c_invoice_2"  value='125'></td>        

<td><input type="text" name="c_freight_2"  value='5.00' onBlur="linetotal(this)" > </td>        

<td><input type="text" name="c_miscamt_2"     value='6.00'></td>        

<td><input type="text" name="c_price_2"     value='11.00'></td>        

</tr>

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

Open in new window

0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
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…

919 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

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now