How to insert a valueof variable into text box?

rjddude1

Well I know how to pass value of an item from drop down list to a text box, but this ones different. I'm very new to javascript and have no idea how to pass value calculated variable into a text box.

Expand|Select|Wrap|Line Numbers

 
function calct()

{

var un1=document.getElementById("unit").value;

var qn1=document.getElementById("qty").value;

var x1=eval(un1);

var y1=eval(qn1);

var z1=eval(x1*y1);

document.getElementById("subtl").value= z1;

}

and then i need the value of the variable subtotal in a text box with id subtl
I think its wrong because it gives me NaN as the value for my text box subtl

And i dont know how to generalize a function. I have multiple variable "unit" (unit1, unit2, unit3... ), "qty" (qty1, qty2, qty3...) and aslo 'subtl" so I was wondering if there is a way to use 1 function for all of them?

gits

you shouldn't ever use eval. all values that you retrieve from a node are 'string'-values first ... so you could use the parseFloat() method to cast them to numbers, i.e.:

Expand|Select|Wrap|Line Numbers

var x1 = parseFloat(un1);

in case the value is not parsable as number then x1 will be NaN = NotANumber ... you could check that before the calculation and react with code :)

to the other point: please show a short example for it so that we could follow how you have your fields and how you want to call the function. basicly you could pass the ids of the nodes to the function and then use them as parameters inside the function.

kind regards

rjddude1

There are 6 more rows like this below:
Now I want a way to use the function showprice1 and calc1 in those 6 rows.

Expand|Select|Wrap|Line Numbers

 
function showprice1()

{

var itm=document.getElementById("item1");

document.getElementById("unit1").value=itm.options[itm.selectedIndex].value;

}

<tr>

<td><select id="item1" onchange="showprice1()">

<option value=0.00 selected>None</option>

<option value=0.95>Shirts</option>

<option value=2.75>Pants</option>

<option value=5.50>Dress</option>

<option value=8.90>Suit</option>

<option value=4.50>Bed Sheets</option>

<option value=3.00>Others</option>

</select>

<script type="text/javascript">

<!--

function calct1()

{

var un1=document.getElementById("unit1").value;

var qn1=document.getElementById("qty1").value;

var x1=parseFloat(un1);

var y1=parseFloat(qn1);

var z1=(x1*y1);

var sb1=z1.toFixed(2);

document.getElementById("sub1").value=sb1;

}

// -->

</script>

<td><input type="text" id="unit1" size="6" maxlength="6" value=0.00 readonly></td>

<td><input type="text" id="qty1" size="6" maxlength="6" value=0 onclick=(this.value="")></td>

<td><input type="submit" value="Calc" onsclick="calct1()"></td>

<td><input type="text" id="sub1" size="6" maxlength="6" value=0.00></td>

</tr>

The parseFloat doesn't work. Could you please tell me what I'm doing wrong.
Thank you very much

gits

it works but you have some errors ... have a look at the following working example:

Expand|Select|Wrap|Line Numbers

 <html xmlns="http://www.w3.org/1999/xhtml">
 
<head>

<script type="text/javascript">
 
function calct1(unId, quId, stId) {

    var un1=document.getElementById(unId).value;

    var qn1=document.getElementById(quId).value;

    var x1=parseFloat(un1);

    var y1=parseFloat(qn1);

    var z1=(x1*y1);

    var sb1=z1.toFixed(2);

    document.getElementById(stId).value=sb1;

}
 
</script>

</head>

<body>

    <input type="text" id="unit1" size="6" maxlength="6" value="8.00" readonly="readonly">

    <input type="text" id="qty1" size="6" maxlength="6" value="0" onclick="(this.value='')">

    <input type="submit" value="Calc" onclick="calct1('unit1', 'qty1', 'sub1')">

    <input type="text" id="sub1" size="6" maxlength="6" value="0.00">

    <br/><br/>

    <input type="text" id="unit2" size="6" maxlength="6" value="8.00" readonly="readonly">

    <input type="text" id="qty2" size="6" maxlength="6" value=0 onclick="(this.value='')">

    <input type="submit" value="Calc" onclick="calct1('unit2', 'qty2', 'sub2')">

    <input type="text" id="sub2" size="6" maxlength="6" value="0.00">

</body>

</html>

note that you have a wrong onclick that was onsclick and the onclick to reset the values have to be quoted. i even used the field ids to show you haow to pass that as params to the function to use that function genarally ...

kind regards

rjddude1

Thank you very much.
This was very helpful. I really appreciate your help.

Regards

RD

gits

no problem ... just post back to the forum anytime you have more questions :)

kind regards

How to insert a valueof variable into text box?

re: How to insert a valueof variable into text box?

re: How to insert a valueof variable into text box?

re: How to insert a valueof variable into text box?

re: How to insert a valueof variable into text box?

re: How to insert a valueof variable into text box?

Similar JavaScript / Ajax / DHTML bytes

/bytes/development

/bytes/it

/bytes/about