...

View Full Version : Getting the Sum of Two Variables



Wayniac
05-24-2009, 05:02 PM
I would like to multiply combo_1 and combo_2 to give an outcome and display it in the textbox of txt_price using javascript.

f['txt_price'].value = (f['combo_1'].value).toFixed(2);

This is something I was working on but no results so far. Any help would be greaty appreciated.

<form>
<select name="combo0" id="combo_0" onChange="change(this);" style="width:200px;">
<option value="0">-select-</option>
<option value="1">Canada</option>
<option value="2">States</option>

</select>
<BR><BR>

<!-- I would like to Multiply this field -->
<select name="combo1" id="combo_1" onChange="change(this)" style="width:200px;">
<option value="1"></option>
</select>
<label></label>
<BR>
<BR>

<!-- and this field -->
<select name="combo2" id="combo_2" onChange="change(this);" style="width:200px;">
<option value="1"></option>
</select>
<BR>
<br>

<!-- To present an outcome to this field -->
<input type="text" name="txtPrice" id="txt_price" onChange="change(this);" style="width:200px;">
<BR>
</form>

Philip M
05-24-2009, 05:50 PM
Here you are:-


<!-- I would like to Multiply this field -->
<select name="combo1" id="combo_1" onChange="change(this);" style="width:200px;">
<option value="0">-Select-</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<label></label>
<BR>
<BR>

<!-- and this field -->
<select name="combo2" id="combo_2" onChange="change(this);" style="width:200px;">
<option value="0">-Select-</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
</select>
<BR>
<br>

<!-- To present an outcome to this field -->
<input type="text" name="txtPrice" id="txt_price" style="width:200px; readonly">
<BR>
</form>

<script type = "text/javascript">
function change() {
document.getElementById("txt_price").value ="";
var a = document.getElementById("combo1").value;
var b = document.getElementById("combo2").value;
if (a*b > 0 ){
document.getElementById("txt_price").value = (a*b).toFixed(2);
}
}

</script>


A man explained inflation to his wife thus: 'When we married, you measured 36-24-36. Now you're 42-42-42. There's more of you, but you are not worth as much."

Wayniac
05-24-2009, 07:37 PM
Thank you, that almost works. It does to the calculation, but for some reason its not doing the math for the combo_1 and combo_2, just the initial combo_0. Which seems very weird, I think I have it placed in the wrong spot.

Here is the full code I am practicing with.

Thank you

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>untitled</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">

<body>

<script type="text/javascript">

function setEvent(){
var but, i=1;
while(but=document.getElementById('calc_'+(i++))){
but.onclick=calculate
}
}
function calculate(){
var f=this.form, grandtotV=0, j=1, i=1, but;
while(but=document.getElementById('calc_'+(j++))){
var oQty=f['qty_'+i];
var oPrice=f['price_'+i];
// var oTaxrate=f['taxrate_'+i];
// var oSubtotal=f['subtotal_'+i];
// var oTax=f['tax_'+i];
// var oTotal=f['total_'+i];
i++;
var subV=Number(oQty.value)*Number(oPrice.value);
// var taxV=subV*Number(oTaxrate.value);
// var totV=subV+subV*Number(oTaxrate.value);
var totV=subV;
grandtotV+=totV;

// oSubtotal.value=subV==0?'':subV.toFixed(2);
// oTax.value=taxV==0?'':taxV.toFixed(2);
// oTotal.value=totV==0?'':totV.toFixed(2);

//if (qty_1 = 0)
// {
//alert("0");
// }
//else if (qty_1 = 1)
// {
//alert("1");
//}
//else if (qty_1 = 2)
// {
//alert("2");
// }

//}

//alert('testing')

f['testTotal'].value = (f['qty_1'].value).toFixed(2);
//f['testTotal'].value = (f['price_1'].value * f['qty_1'].value).toFixed(2);
f['partstotal'].value=grandtotV.toFixed(2);
f['tax'].value = (f['partstotal'].value * f['taxrate'].value).toFixed(2);
f['gtotal'].value = ((f['partstotal'].value * f['taxrate'].value) + grandtotV).toFixed(2);

}

onload=setEvent
</script>

<form action="">
<div>

<script language="JavaScript" type="text/javascript">
<!--

/*
*** Multiple dynamic combo boxes
*** by Mirko Elviro, 9 Mar 2005
*** Script featured and available on JavaScript Kit (http://www.javascriptkit.com)
***
***Please do not remove this comment
*/

// This script supports an unlimited number of linked combo boxed
// Their id must be "combo_0", "combo_1", "combo_2" etc.
// Here you have to put the data that will fill the combo boxes
// ie. data_2_1 will be the first option in the second combo box
// when the first combo box has the second option selected

// first combo box

data_1 = new Option("Canada", "$");
data_2 = new Option("States", "$$");

// second combo box

// Canada - Quantity
data_1_1 = new Option("1", "-");
data_1_2 = new Option("2", "-");
data_1_3 = new Option("3", "-");
data_1_4 = new Option("4", "-");
data_1_5 = new Option("5", "-");
data_1_6 = new Option("6", "-");
data_1_7 = new Option("7", "-");
data_1_8 = new Option("8", "-");
data_1_9 = new Option("9", "-");
data_1_10 = new Option("10", "-");

// States - Quantity
data_2_1 = new Option("1", "-");
data_2_2 = new Option("2", "-");
data_2_3 = new Option("3", "-");
data_2_4 = new Option("4", "-");
data_2_5 = new Option("5", "-");
data_2_6 = new Option("6", "-");
data_2_7 = new Option("7", "-");
data_2_8 = new Option("8", "-");
data_2_9 = new Option("9", "-");
data_2_10 = new Option("10", "-");

// Canada - Price
data_1_1_1 = new Option("1", "*");
data_1_1_2 = new Option("2", "*");
data_1_1_3 = new Option("3", "*");
data_1_1_4 = new Option("4", "*");
data_1_1_5 = new Option("5", "*");
data_1_1_6 = new Option("6", "*");
data_1_1_7 = new Option("7", "*");
data_1_1_8 = new Option("8", "*");
data_1_1_9 = new Option("9", "*");
data_1_1_10 = new Option("10", "*");

data_1_2_1 = new Option("1", "*");
data_1_2_2 = new Option("2", "*");
data_1_2_3 = new Option("3", "*");
data_1_2_4 = new Option("4", "*");
data_1_2_5 = new Option("5", "*");
data_1_2_6 = new Option("6", "*");
data_1_2_7 = new Option("7", "*");
data_1_2_8 = new Option("8", "*");
data_1_2_9 = new Option("9", "*");
data_1_2_10 = new Option("10", "*");

data_1_3_1 = new Option("1", "*");
data_1_3_2 = new Option("2", "*");
data_1_3_3 = new Option("3", "*");
data_1_3_4 = new Option("4", "*");
data_1_3_5 = new Option("5", "*");
data_1_3_6 = new Option("6", "*");
data_1_3_7 = new Option("7", "*");
data_1_3_8 = new Option("8", "*");
data_1_3_9 = new Option("9", "*");
data_1_3_10 = new Option("10", "*");

data_1_4_1 = new Option("1", "*");
data_1_4_2 = new Option("2", "*");
data_1_4_3 = new Option("3", "*");
data_1_4_4 = new Option("4", "*");
data_1_4_5 = new Option("5", "*");
data_1_4_6 = new Option("6", "*");
data_1_4_7 = new Option("7", "*");
data_1_4_8 = new Option("8", "*");
data_1_4_9 = new Option("9", "*");
data_1_4_10 = new Option("10", "*");

data_1_5_1 = new Option("1", "*");
data_1_5_2 = new Option("2", "*");
data_1_5_3 = new Option("3", "*");
data_1_5_4 = new Option("4", "*");
data_1_5_5 = new Option("5", "*");
data_1_5_6 = new Option("6", "*");
data_1_5_7 = new Option("7", "*");
data_1_5_8 = new Option("8", "*");
data_1_5_9 = new Option("9", "*");
data_1_5_10 = new Option("10", "*");

data_1_6_1 = new Option("1", "*");
data_1_6_2 = new Option("2", "*");
data_1_6_3 = new Option("3", "*");
data_1_6_4 = new Option("4", "*");
data_1_6_5 = new Option("5", "*");
data_1_6_6 = new Option("6", "*");
data_1_6_7 = new Option("7", "*");
data_1_6_8 = new Option("8", "*");
data_1_6_9 = new Option("9", "*");
data_1_6_10 = new Option("10", "*");

data_1_7_1 = new Option("1", "*");
data_1_7_2 = new Option("2", "*");
data_1_7_3 = new Option("3", "*");
data_1_7_4 = new Option("4", "*");
data_1_7_5 = new Option("5", "*");
data_1_7_6 = new Option("6", "*");
data_1_7_7 = new Option("7", "*");
data_1_7_8 = new Option("8", "*");
data_1_7_9 = new Option("9", "*");
data_1_7_10 = new Option("10", "*");

data_1_8_1 = new Option("1", "*");
data_1_8_2 = new Option("2", "*");
data_1_8_3 = new Option("3", "*");
data_1_8_4 = new Option("4", "*");
data_1_8_5 = new Option("5", "*");
data_1_8_6 = new Option("6", "*");
data_1_8_7 = new Option("7", "*");
data_1_8_8 = new Option("8", "*");
data_1_8_9 = new Option("9", "*");
data_1_8_10 = new Option("10", "*");

data_1_9_1 = new Option("1", "*");
data_1_9_2 = new Option("2", "*");
data_1_9_3 = new Option("3", "*");
data_1_9_4 = new Option("4", "*");
data_1_9_5 = new Option("5", "*");
data_1_9_6 = new Option("6", "*");
data_1_9_7 = new Option("7", "*");
data_1_9_8 = new Option("8", "*");
data_1_9_9 = new Option("9", "*");
data_1_9_10 = new Option("10", "*");

data_1_10_1 = new Option("1", "*");
data_1_10_2 = new Option("2", "*");
data_1_10_3 = new Option("3", "*");
data_1_10_4 = new Option("4", "*");
data_1_10_5 = new Option("5", "*");
data_1_10_6 = new Option("6", "*");
data_1_10_7 = new Option("7", "*");
data_1_10_8 = new Option("8", "*");
data_1_10_9 = new Option("9", "*");
data_1_10_10 = new Option("10", "*");

// States - Price
data_2_1_1 = new Option("1", "*");
data_2_1_2 = new Option("2", "*");
data_2_1_3 = new Option("3", "*");
data_2_1_4 = new Option("4", "*");
data_2_1_5 = new Option("5", "*");
data_2_1_6 = new Option("6", "*");
data_2_1_7 = new Option("7", "*");
data_2_1_8 = new Option("8", "*");
data_2_1_9 = new Option("9", "*");
data_2_1_10 = new Option("10", "*");

data_2_2_1 = new Option("1", "*");
data_2_2_2 = new Option("2", "*");
data_2_2_3 = new Option("3", "*");
data_2_2_4 = new Option("4", "*");
data_2_2_5 = new Option("5", "*");
data_2_2_6 = new Option("6", "*");
data_2_2_7 = new Option("7", "*");
data_2_2_8 = new Option("8", "*");
data_2_2_9 = new Option("9", "*");
data_2_2_10 = new Option("10", "*");

data_2_3_1 = new Option("1", "*");
data_2_3_2 = new Option("2", "*");
data_2_3_3 = new Option("3", "*");
data_2_3_4 = new Option("4", "*");
data_2_3_5 = new Option("5", "*");
data_2_3_6 = new Option("6", "*");
data_2_3_7 = new Option("7", "*");
data_2_3_8 = new Option("8", "*");
data_2_3_9 = new Option("9", "*");
data_2_3_10 = new Option("10", "*");

data_2_4_1 = new Option("1", "*");
data_2_4_2 = new Option("2", "*");
data_2_4_3 = new Option("3", "*");
data_2_4_4 = new Option("4", "*");
data_2_4_5 = new Option("5", "*");
data_2_4_6 = new Option("6", "*");
data_2_4_7 = new Option("7", "*");
data_2_4_8 = new Option("8", "*");
data_2_4_9 = new Option("9", "*");
data_2_4_10 = new Option("10", "*");

data_2_5_1 = new Option("1", "*");
data_2_5_2 = new Option("2", "*");
data_2_5_3 = new Option("3", "*");
data_2_5_4 = new Option("4", "*");
data_2_5_5 = new Option("5", "*");
data_2_5_6 = new Option("6", "*");
data_2_5_7 = new Option("7", "*");
data_2_5_8 = new Option("8", "*");
data_2_5_9 = new Option("9", "*");
data_2_5_10 = new Option("10", "*");

data_2_6_1 = new Option("1", "*");
data_2_6_2 = new Option("2", "*");
data_2_6_3 = new Option("3", "*");
data_2_6_4 = new Option("4", "*");
data_2_6_5 = new Option("5", "*");
data_2_6_6 = new Option("6", "*");
data_2_6_7 = new Option("7", "*");
data_2_6_8 = new Option("8", "*");
data_2_6_9 = new Option("9", "*");
data_2_6_10 = new Option("10", "*");

data_2_7_1 = new Option("1", "*");
data_2_7_2 = new Option("2", "*");
data_2_7_3 = new Option("3", "*");
data_2_7_4 = new Option("4", "*");
data_2_7_5 = new Option("5", "*");
data_2_7_6 = new Option("6", "*");
data_2_7_7 = new Option("7", "*");
data_2_7_8 = new Option("8", "*");
data_2_7_9 = new Option("9", "*");
data_2_7_10 = new Option("10", "*");

data_2_8_1 = new Option("1", "*");
data_2_8_2 = new Option("2", "*");
data_2_8_3 = new Option("3", "*");
data_2_8_4 = new Option("4", "*");
data_2_8_5 = new Option("5", "*");
data_2_8_6 = new Option("6", "*");
data_2_8_7 = new Option("7", "*");
data_2_8_8 = new Option("8", "*");
data_2_8_9 = new Option("9", "*");
data_2_8_10 = new Option("10", "*");

data_2_9_1 = new Option("1", "*");
data_2_9_2 = new Option("2", "*");
data_2_9_3 = new Option("3", "*");
data_2_9_4 = new Option("4", "*");
data_2_9_5 = new Option("5", "*");
data_2_9_6 = new Option("6", "*");
data_2_9_7 = new Option("7", "*");
data_2_9_8 = new Option("8", "*");
data_2_9_9 = new Option("9", "*");
data_2_9_10 = new Option("10", "*");

data_2_10_1 = new Option("1", "*");
data_2_10_2 = new Option("2", "*");
data_2_10_3 = new Option("3", "*");
data_2_10_4 = new Option("4", "*");
data_2_10_5 = new Option("5", "*");
data_2_10_6 = new Option("6", "*");
data_2_10_7 = new Option("7", "*");
data_2_10_8 = new Option("8", "*");
data_2_10_9 = new Option("9", "*");
data_2_10_10 = new Option("10", "*");

// fourth combo box

data_2_2_1_1 = new Option("2211","%")
data_2_2_1_2 = new Option("2212","%%")

// other parameters

displaywhenempty=""
valuewhenempty=-1

displaywhennotempty="-select-"
valuewhennotempty=0


function change(currentbox) {
numb = currentbox.id.split("_");
currentbox = numb[1];

i=parseInt(currentbox)+1

// I empty all combo boxes following the current one

while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) &&
(document.getElementById("combo_"+i)!=null)) {
son = document.getElementById("combo_"+i);
// I empty all options except the first one (it isn't allowed)
for (m=son.options.length-1;m>0;m--) son.options[m]=null;
// I reset the first option
son.options[0]=new Option(displaywhenempty,valuewhenempty)
i=i+1
}


// now I create the string with the "base" name ("stringa"), ie. "data_1_0"
// to which I'll add _0,_1,_2,_3 etc to obtain the name of the combo box to fill

stringa='data'
i=0
while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) &&
(document.getElementById("combo_"+i)!=null)) {
eval("stringa=stringa+'_'+document.getElementById(\"combo_"+i+"\").selectedIndex")
if (i==currentbox) break;
i=i+1
}


// filling the "son" combo (if exists)

following=parseInt(currentbox)+1

if ((eval("typeof(document.getElementById(\"combo_"+following+"\"))!='undefined'")) &&
(document.getElementById("combo_"+following)!=null)) {
son = document.getElementById("combo_"+following);
stringa=stringa+"_"
i=0
while ((eval("typeof("+stringa+i+")!='undefined'")) || (i==0)) {

// if there are no options, I empty the first option of the "son" combo
// otherwise I put "-select-" in it

if ((i==0) && eval("typeof("+stringa+"0)=='undefined'"))
if (eval("typeof("+stringa+"1)=='undefined'"))
eval("son.options[0]=new Option(displaywhenempty,valuewhenempty)")
else
eval("son.options[0]=new Option(displaywhennotempty,valuewhennotempty)")
else
eval("son.options["+i+"]=new Option("+stringa+i+".text,"+stringa+i+".value)")
i=i+1
}
//son.focus()
i=1
combostatus=''
cstatus=stringa.split("_")
while (cstatus[i]!=null) {
combostatus=combostatus+cstatus[i]
i=i+1
}
return combostatus;
}
}

//f['txt_price'].value = (f['combo_1'].value).toFixed(2);

//-->
onload=setEvent
</script>

<form>
<select name="combo0" id="combo_0" onChange="change(this);" style="width:200px;">
<option value="0">-select-</option>
<option value="1">Canada</option>
<option value="2">States</option>

</select>
<BR><BR>

<!-- I would like to Multiply this field -->
<select name="combo1" id="combo_1" onChange="change(this)" style="width:200px;">
<option value="1"></option>
</select>
<label></label>
<BR>
<BR>

<!-- and this field -->
<select name="combo2" id="combo_2" onChange="change(this);" style="width:200px;">
<option value="1"></option>
</select>
<BR>
<br>

<!-- To present an outcome to this field -->
<input type="text" name="txtPrice" id="txt_price" onChange="change(this);" style="width:200px;">
<BR>
</form>

<script type = "text/javascript">
function change() {
document.getElementById("txt_price").value = "";
var a = document.getElementById("combo_1").value;
var b = document.getElementById("combo_2").value;
if (a*b > 0 ){
document.getElementById("txt_price").value = (a*b).toFixed(2);
}
}



</script>

<label>TestTotal
<input type="text" name="testTotal" id="testTotal">
</label>
<br>
Price:
<input type="text" name='price_1'>
<br>
<input type="button" value="Calculate" id="calc_1">
Tax Rate:
<input type="text" name="taxrate" value="0.0825">
<br>
Tax:
<input type="text" name="tax" readonly="readonly">
<br>
Sub Total:
<input type="text" name="partstotal" readonly="readonly">
<br>
Grand Total:
<input type="text" name="gtotal" readonly="readonly">
</form>

<!-- ####################### stop copying the body menu code here ####################### -->
<br>
<br>
<br>
<label></label>
</body>
</html>

Wayniac
05-24-2009, 08:42 PM
Issue resolved, that you very much. Here is the working code.

<select name="combo1" id="combo_1" style="width:200px;">

<option value="1">1</option>

<option value="2">2</option>

<option value="3">3</option>

</select>

<label></label>

<BR>

<BR>



<!-- and this field -->

<select name="combo2" id="combo_2" style="width:200px;">

<option value="1">1</option>

<option value="5">5</option>

</select>

<BR>

<br>



<!-- To present an outcome to this field -->

<input type="text" name="txtPrice" id="txt_price" style="width:200px;">

<BR>

</form>



<script type="text/javascript">

// avoid using inline script like onclick and onchange, bad practice.

window.onload = function() {

var dropChange = function() {

var v1 = document.getElementById("combo_1").value, v2 = document.getElementById("combo_2").value;

document.getElementById("txt_price").value = v1 * v2;

};



document.getElementById("combo_1").onchange = dropChange;

document.getElementById("combo_2").onchange = dropChange;

};

Philip M
05-25-2009, 07:39 AM
while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) &&
(document.getElementById("combo_"+i)!=null)) {
eval("stringa=stringa+'_'+document.getElementById(\"combo_"+i+"\").selectedIndex")
if (i==currentbox) break;
i=i+1
}


// filling the "son" combo (if exists)

following=parseInt(currentbox)+1

if ((eval("typeof(document.getElementById(\"combo_"+following+"\"))!='undefined'")) &&
(document.getElementById("combo_"+following)!=null)) {
son = document.getElementById("combo_"+following);
stringa=stringa+"_"
i=0
while ((eval("typeof("+stringa+i+")!='undefined'")) || (i==0)) {

// if there are no options, I empty the first option of the "son" combo
// otherwise I put "-select-" in it

if ((i==0) && eval("typeof("+stringa+"0)=='undefined'"))
if (eval("typeof("+stringa+"1)=='undefined'"))
eval("son.options[0]=new Option(displaywhenempty,valuewhenempty)")
else
eval("son.options[0]=new Option(displaywhennotempty,valuewhennotempty)")
else
eval("son.options["+i+"]=new Option("+stringa+i+".text,"+stringa+i+".value)")
i=i+1
}



eval() - Old Pedant and Kor will throw blue fits!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum