asked on

add the value in text field using document.getElementById()

Hi experts,

my page has several check boxs, radios , and each item has its value (number). i wanna add all the value to be a amount value and display it in a text field.

i have red the old questions talk about the similar content. but why my friends said should use the:
document.getElementById().nameOfTextField.value = amount;

and until now... my text field function still doesn't work

please help

ASKER CERTIFIED SOLUTION

Zyloch

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Batalf

document.getElementById() is used on elements that got an id

example:

<input type="text" id="idOfTextField" name="nameOfTextField">

then you could refer to it like this:

document.getElementById('idOfTextField').value = amount;

If they don't have any id, you have to use the formobject, and refer to it by this syntax

document.formName.nameOfTextField.value = amount;

example:

<form name="formName">
<input type="text" id="idOfTextField" name="nameOfTextField">
</form>

Batalf

Zyloch

Oops. Forgot the .value at the end

Should be document.forms["formname"].elementname.value

Regards...

yuxie

ASKER

i have tried what u teach, but still doesn't show the sum in the textfield. my page is .shtml file.

how can i test my page? there are some codes of my page. r there any parts wrong causing my problem?

form name: quoForm
text field name: amount

<script type="text/javascript">
function calAmount(){
var sum=0;
var v1=0;
v1=document.quoForm.model.value;
sum=v1;
document.quoForm.amount.value=sum;
}
//-->javascript calculate total amount
</script>

<form id="quo" name="quoForm" action="#" method="get">
<select name="model">
      <option value="13000"> HS001 </option>
      <option value="39000"> HI002 </option>
      <option value="55000"> HI003 </option>
</select>
<input type="text" name="amount" size="10" maxlength="20" value="0"/>
<input type="button" value="submit" onclick="calAmount()" />

raj3060

OK try this:

<script type="text/javascript">
function calAmount(){
var sum=0;
sum=document.getElementById('model1').value*1 + document.getElementById('model2').value*1
document.getElementById('amount').value = sum
}
//-->javascript calculate total amount
</script>

<form id="quo" name="quoForm" action="#" method="get">
<select name="model" id="model1">
<option value="13000"> HS001 </option>
<option value="39000"> HI002 </option>
<option value="55000"> HI003 </option>
</select>
<select name="model" id="model2">
<option value="13000"> HS001 </option>
<option value="39000"> HI002 </option>
<option value="55000"> HI003 </option>
</select>

<input type="text" id="amount" size="10" maxlength="20" value="0"/>
<input type="button" value="submit" onclick="calAmount()" />