Solved

Get form field value using an offset   in a Function

Posted on 2008-06-20
4
422 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

ScreenConnect 6.0 Free Trial

Discover new time-saving features in one game-changing release, ScreenConnect 6.0, based on partner feedback. New features include a redesigned UI, app configurations and chat acknowledgement to improve customer engagement!

Question has a verified solution.

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

Suggested Solutions

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
This article discusses how to create an extensible mechanism for linked drop downs.
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…

770 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