PDA

Click to See Complete Forum and Search --> : Returning Multiple Values From a Function

reub77
03-26-2006, 12:06 AM
I am trying to use javascript to calculate some equations and then return results to several different calculations. I am a bit confused at the syntax on how to pull several different values from my function. I can't even pull one properly as of yet. Can someone help? I will most likely be needing pull 6 or 7 different values from the function. But I'm just trying for three right now. This is my code:


<html>
<head>
<script language="javascript">
<!--
//alert("howdy");
function calculate() {
alert("howdy");
if(calc.annincome.value <= 0)
{
alert("Please enter an annual income amount!");
}
else if (calc.exptax.value <= 0)
{
alert("Please enter an expected tax rate amount!");
}
else if (calc.expannmedexp.value <= 0)
{
alert ("Please enter an expected annual medical expenses amount!");
}
else {
alert("calculating");

/*calc.p1.value = calc.annincome.value;
calc.p3.value = calc.exptax.value;
calc.p2.value = (calc.expannmedexp.value)*(calc.exptax.value);*/

var annincome_X = calc.annincome.value;
var exptax_X = calc.exptax.value;
var amountpaidtax_X = (calc.expannmedexp.value)*(calc.exptax.value);

var div = document.getElementById("p1");
var div2 = document.getElementById("p3");
var div3 = document.getElementById("p2");

div.style.display = "inline";
div2.style.display = "inline";
div3.style.display = "inline";

alert("calculated");

alert("Annual Income: " + annincome_X);
alert("Amount Paid to Taxes: " + amountpaidtax_X);
alert("Expected Annual Medical Expenses: " + exptax_X);
return annincome_X;
}
}
//-->
</script>
</head>
<body>
<form name="calc">
Annual Income: <input name="annincome" type="text" id="annincome" /><br />
Expected Tax Rate: <input name="exptax" type="text" id="exptax" /><br />
Expected Annual Medical Expenses: <input name="expannmedexp" type="text" id="expannmedexp" /><br />

<input type="submit" value="Calculate" onclick="calculate(); return false;" /><br />

<script language="javascript">
var calc1 = 0;
calc1 = calculate();
document.write("<div id='p1' style='display:none;'><b>Annual Income: "+ calc.annincome.value +"</b><br /><br />");

document.write("<div id='p2' style='display:none;'><b>Amount Paid to Taxes: "+ (calc.expannmedexp.value)*(calc.exptax.value) +"</b><br /><br />");

document.write("<div id='p3' style='display:none;'><b>Expected Annual Medical Expenses: "+ calc.exptax.value +"</b>");

</script>
</form>
</body>
</html>
Kor
03-26-2006, 01:21 AM
confusing demand... Yet, at a first glance there are some another errors in your code.

1. unless it is self referenced, any document's element should be referenced as so:

var exptax_X = document.calc.exptax.value;

2. except of some few readonly ones, the attributes return string as value, so that before any math add/substract or bitwise math comparision, they must be transformed into numbers if needed

if(Number(document.calc.annincome.value) <= 0)
reub77
03-26-2006, 09:37 AM
Thanks for your quick reply, however, my question wasn't how do I declare a form variable or how do I use variables from a form. My question was: How do I use data I calcuate from a function when I need to use several different results from several different calculations.

eg. Total Amount of Tax Owing, Total Savings etc.

In my code I am only needing the total tax, total amount owing, and the rate. Two of these variables are given to me in the form, the other I need to get by performing some calculation. I will going forward need to know how to grab the answers to many different calculations. As far as I know you can only return one variable at the end of a function. How do I return several and then how do i call them outside the function?

Thanks
felgall
03-26-2006, 02:20 PM
There are three ways to return multiple values from a function.

1. Update global variables from within the function (a poor solution)
2. Put all of the values to be returned into an array and return the array.
3. Create an object and attach all of the values to be returned to the object then return the object.

See http://javascript.about.com/library/blmultir.htm for more details.
reub77
03-27-2006, 11:47 PM
Thanks, for the tutorial. I'm sure it works great but not for the way I'm using it I guess. I simplified my code so that it's easier to read:


<html>
<head>
<script language="javascript">
<!--
var a = calculate();

function calculate() {
alert("howdy");
if(calc.annincome.value <= 0)
{
alert("Please enter an annual income amount!");
}
else if (calc.exptax.value <= 0)
{
alert("Please enter an expected tax rate amount!");
}
else if (calc.expannmedexp.value <= 0)
{
alert ("Please enter an expected annual medical expenses amount!");
}
else {
alert("calculating");

//CALCULATIONS
var annincome_X = calc.annincome.value;
var exptax_X = calc.exptax.value;
var amountpaidtax_X = (calc.expannmedexp.value)*(calc.exptax.value);

var div = document.getElementById("p1");

div.style.display = "inline";

alert("calculated");

alert("Annual Income: " + annincome_X);
alert("Amount Paid to Taxes: " + amountpaidtax_X);
alert("Expected Annual Medical Expenses: " + exptax_X);

return [annincome_X, amountpaidtax_X, exptax_X];
}
}
//-->
</script>
</head>
<body>
<form name="calc">
Annual Income:
<input name="annincome" type="text" id="annincome" /><br />
Expected Tax Rate:
<input name="exptax" type="text" id="exptax" /><br />
Expected Annual Medical Expenses:
<input name="expannmedexp" type="text" id="expannmedexp" /><br />

<input type="submit" value="Calculate" onclick="calculate(); return false;" /><br />
</form>
<script language="javascript">
//var annincome_X = 0;

document.write("<div id='p1' style='display:none;'><b>Annual Income: "+ a[0] +"</b><br /><br />");

document.write("<b>Amount Paid to Taxes: "+ a[1] +"</b><br /><br />");

document.write("<b>Expected Annual Medical Expenses: "+ a[2] +"</b></div>");

</script>
</body>
</html>
felgall
03-28-2006, 02:43 PM
With your code you now have a as an array containng the income in a[0], paidtax in a[1] and exptax in a[2]. You should be able to do what you want with them after returning by referencing them from the array.
reub77
03-28-2006, 03:51 PM
I would have thought so too. But it's not working as it should. And I have no idea why.
Kramy
03-28-2006, 04:53 PM
I'm sure people will shutter at my solution, but here's to objects and innerHTML.

If you want you can stick all the functions inside the TaxCalculator, and lop off the TaxCalculator_ prefix. I'm not sure if that would have any effect on the requirement of this. on anything local.

<html>
<head>
<script type="text/javascript">
<!--
var TaxCalc = new TaxCalculator();


function TaxCalculator()
{
this.AnnualIncome = 0;
this.ExpectedTaxRate = 0;
this.ExpectedAnnualMedicalExpenses = 0;

this.AmountPaidTax = 0;

this.Calculate = TaxCalculator_Calculate;
this.DisplayResults = TaxCalculator_DisplayResults;
}


function TaxCalculator_Calculate()
{
this.AnnualIncome = document.getElementById("annincome").value;
this.ExpectedTaxRate = document.getElementById("exptax").value;
this.ExpectedAnnualMedicalExpenses = document.getElementById("expannmedexp").value;


if(this.AnnualIncome < 0) this.AnnualIncome = 0;
if(this.ExpectedTaxRate < 0) this.ExpectedTaxRate = 0;
if(this.ExpectedAnnualMedicalExpenses < 0) this.ExpectedAnnualMedicalExpenses = 0;


this.AmountPaidTax = this.ExpectedAnnualMedicalExpenses*this.ExpectedTaxRate;
}


function TaxCalculator_DisplayResults()
{
var DisplayData = 'Annual Income: <b>'+this.AnnualIncome+'</b><br /><br />';
DisplayData += 'Amount Paid to Taxes: <b>'+this.AmountPaidTax+'</b><br /><br />';
DisplayData += 'Expected Annual Medical Expenses: <b>'+this.ExpectedAnnualMedicalExpenses+'</b>';

document.getElementById("p1").innerHTML = DisplayData;
}
//-->
</script>
</head>

<body>
<form name="calc">
Annual Income: <input name="annincome" type="text" id="annincome" /><br />
Expected Tax Rate: <input name="exptax" type="text" id="exptax" /><br />
Expected Annual Medical Expenses: <input name="expannmedexp" type="text" id="expannmedexp" /><br />
<input type="button" value="Calculate" onClick="TaxCalc.Calculate(); TaxCalc.DisplayResults();" /><br />
</form>

<div id='p1'>Blank</div>

</body>
</html>
It seems to work in Maxthon(IE6), Firefox 1.5.0.1, Seamonkey 1.0, and Opera 8.5.3

To add new functionality, just add new functions on to it. Easily extensible, even if site specific.
AltF4
03-28-2006, 05:10 PM
<input type="button" value="blahblah" onclicl="function(document.nameofform.nameofvalue.value)">
IN YOUR JAVASCRIPT
document.write(finalresult)