Assigning value to text field when the name is dynamic

annieoakley · 06-09-2008, 10:17 PM

Hello,
I've got a form that loops through a dataset where a user will enter values in 2 columns and the third column is a formula containing the first 2 columns. The name of the field is going to change each time through the dataset (this is in .asp). I can't quite figure out how to get the calculated formula result back into the text field.

Here is an example of the code:
<% while not rs.eof %>
<TR class="GenTab">
<TD><%= rs("Name") %></td>
<TD><input type="text" name="GradeSpan<%= rs("code")%>" class="GenTab"></td>
<TD><input type="text" name="enroll<%= rs("code")%>" class="GenTab"></td>
<TD><input type="text" name="FTEStaff<%= rs("code")%>" value="0" class="GenTab" onBlur="CalcRatio();"></td>
<TD><input type="text" name="ratio<%= rs("code")%>" class="GenTab" readonly></td>
<TD></td>
</tr>
<% rs.movenext
wend
%>

So it loops through this with every result of the dataset. Here is the javascript function:
function CalcRatio(){
var theForm=document.main;
var x=theForm.sCode.value; (where this is rs(code) below)
var eInt, fInt, sTotal
eInt = eval('theForm.enroll' + x + '.value');
fInt = eval('theForm.FTEStaff' + x + '.value');
}

I then need this: eInt/fInt and assign it to the ratio textfield. What I can seem to do is something like this:

theForm.ratio+x+.value=eInt/fInt

I *can* do this:
var total = 'theForm.ratio' + x + '.value';
total = eInt/fInt

But still, can't then get that value back down into the textbox.

I hope this makes sense and *really* hope someone can help!!! TIA

Kor · 06-10-2008, 10:50 AM

If your rows structure is repetitive, you may use something like this:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>untitled</title>
<script type="text/javascript">
function CalcRatio(obj){
if(isNaN(obj.value)){
obj.value='';
alert('Input a valid number!');
obj.focus();
}
var inp=obj.parentNode.parentNode.getElementsByTagName('input');
inp[3].value=Number(inp[1].value)/Number(inp[2].value);
}
</script>
</head>
<body>
<form>
<table width="300">
<tr>
<td>Name</td>
<td></td>
<td><input type="text" name="GradeSpanA"></td>
<td><input type="text" name="enrollA" onkeyup="CalcRatio(this)"></td>
<td><input type="text" name="FTEStaffA" value="0" onkeyup="CalcRatio(this)"></td>
<td><input type="text" name="ratioA" readonly="redonly"></td>
</tr>
<tr>
<td>Name</td>
<td></td>
<td><input type="text" name="GradeSpanB"></td>
<td><input type="text" name="enrollB" onkeyup="CalcRatio(this)"></td>
<td><input type="text" name="FTEStaffB" value="0" onkeyup="CalcRatio(this)"></td>
<td><input type="text" name="ratioB" readonly="redonly"></td>
</tr>
</table>
</form>
</body>
</html>

annieoakley · 06-10-2008, 02:03 PM

Unfortunately it isn't repetitive and I won't know how many rows there are, it is all database driven. The <TR> tag repeats itself for how many records are returned, so I can't really hard code each <TR> section - it is all done through a loop.

Kor · 06-10-2008, 02:18 PM

You did not understand. By repetitive I meant it does not matter how many rows they are, but if you need to display a result of x/y and the common pattern is:
- you always have 4 inputs in a row
- the second input returns the x value
- the third returns the y value
- the fourth displays the result x/y

...the code works. You could have at least given a try. All you have to do is to use this handler onkeyup="CalcRatio(this)" into the second and third inputs (those with name="enrollwhichever" and name="FTEStaffwhichever") on each row. The code is full dynamic. It does not matter how many rows are or which are the names of the inputs. It uses only relative DOM relationship

annieoakley · 06-10-2008, 02:44 PM

I will give it a try now. Sorry I didn't try it before replying to your last message.

annieoakley · 06-10-2008, 02:53 PM

That works perfectly!! Thank you so much! Another quick question on this. Is there a special way to round inp[3] to one decimal place? (i.e. 7.5, 6.3, etc). Math.round doesn't seem to work.

Kor · 06-10-2008, 03:01 PM

toFixed(floatdigits)

I guess I should do also another trick, to avoid "infinity" result when the divisor is 0:

Code:

<script type="text/javascript">
function CalcRatio(obj){
if(isNaN(obj.value)){
obj.value='';
alert('Input a valid number!');
obj.focus();
}
var inp=obj.parentNode.parentNode.getElementsByTagName('input');
inp[3].value=Number(inp[2].value)==0?'':(Number(inp[1].value)/Number(inp[2].value)).toFixed(2);
}
</script>

annieoakley · 06-10-2008, 03:04 PM

Thank you again!