Solved

Get form field value using an offset   in a Function

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

Threat Intelligence Starter Resources

Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

Join & Write a Comment

This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
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…

743 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

11 Experts available now in Live!

Get 1:1 Help Now