Javascript Multiplication and IF / Else

I want to do multiplication in Javascript but I'm not sure how to write the If Else part:
<script>

function findSum(){
	var myBox1 = document.getElementById('qty1').value;	
	var myBox2 = document.getElementById('qty2').value;
	var myBox2a = if(myBox2 != '') { myBox2 } else { 1 };
	var myBox3 = document.getElementById('qty3').value;
	var myBox3a = if(myBox3 != '') { myBox3 } else { 1 };
	var result = document.getElementById('result');	
     var myResult = myBox1 * myBox2a * myBox3a;
		result.value = myResult;
}
</script>

Open in new window

LVL 7
rgranlundAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

GaryCommented:
Whats the problem you are having, code looks OK
0
rgranlundAuthor Commented:
Is there a way to tighten it up?  When I run it, it does not do anything . It adds up nothing.
0
rgranlundAuthor Commented:
The whole thing:
<script>

function findSum(){
	var myBox1 = document.getElementById('qty1').value;	
	var myBox2 = <?php echo $a; ?>;
	var myBox3 = <?php echo $b; ?>;
	var result = document.getElementById('result');	
     var myResult = myBox1 * myBox2 * myBox3;
		result.value = myResult;
}
</script>
?>
<script>

function findSum(){
	var myBox1 = document.getElementById('qty1').value;	
	var myBox2 = document.getElementById('qty2').value;
	var myBox2a = if(myBox2 != '') { myBox2 } else { 1 };
	var myBox3 = document.getElementById('qty3').value;
	var myBox3a = if(myBox3 != '') { myBox3 } else { 1 };
	var result = document.getElementById('result');	
     var myResult = myBox1 * myBox2a * myBox3a;
		result.value = myResult;
}
</script>

<title>HTML5 Page With JavaScript Form Input Control Summation</title>
</head>
<body>

<form>
Qty1 : 	<input name="qty1" id="qty1" class="qty" value="183.60" autocomplete="off" /><br>
Qty2 : 	<select name="qty2" id="qty2" class="qty" autocomplete="off" >
			<option value="">Select an option...</option>
			<option value="1">1</option>
			<option value=".925">.925</option>
			<option value=".85">.85</option>
			<option value=".80">.80</option>
		</select>
		
	<br>
Qty3 : <select name="qty3" id="qty3" class="qty" autocomplete="off" >
			<option value="">Select an option...</option>
			<option value="1.00">1.00</option>
			<option value="1.00">1.00</option>
			<option value=".85">.85</option>
			<option value=".80">.80</option>
		</select>
<br>
Total : <input readonly type="text" name="total" id="result"/>
<input type="button" value="Preview" onclick="findSum()" />
</form>

Open in new window

0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

Ray PaseurCommented:
See if this makes sense.  It sets a default value for the select controls.

<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<meta charset="utf-8" />
<meta name="robots" content="noindex, nofollow" />

<script>

function findSum(){
    var myBox1 = document.getElementById('qty1').value;
    var myBox2 = document.getElementById('qty2').value;
    var myBox3 = document.getElementById('qty3').value;
    var result = document.getElementById('result');
    var myResult = myBox1 * myBox2 * myBox3;
    result.value = myResult;
}
</script>

<title>HTML5 Page With JavaScript Form Input Control Summation</title>
</head>
<body>

<form>
Qty1 : <input name="qty1" id="qty1" class="qty" value="183.60" autocomplete="off" /><br>
Qty2 : <select name="qty2" id="qty2" class="qty" autocomplete="off" >
            <option value="1">Select an option...</option>
            <option value="1">1</option>
            <option value=".925">.925</option>
            <option value=".85">.85</option>
            <option value=".80">.80</option>
        </select>
    <br>
Qty3 : <select name="qty3" id="qty3" class="qty" autocomplete="off" >
            <option value="1">Select an option...</option>
            <option value="1.00">1.00</option>
            <option value="1.00">1.00</option>
            <option value=".85">.85</option>
            <option value=".80">.80</option>
        </select>
<br>
Total : <input readonly type="text" name="total" id="result"/>
<input type="button" value="Preview" onclick="findSum()" />
</form>

</body>
</html>

Open in new window

0
GaryCommented:
Change your script to the following, I assume the double script was just a pasting error

<script>
function findSum(){
	var myBox1 = document.getElementById('qty1').value;	
	var myBox2 = document.getElementById('qty2').value;

	var myBox2a = myBox2 != '' ? myBox2 : 1;

	var myBox3 = document.getElementById('qty3').value;

	var myBox3a = myBox3 != '' ? myBox3 : 1;

	var result = document.getElementById('result');	
	var myResult = myBox1 * myBox2a * myBox3a;
	result.value = myResult;
}
</script>

Open in new window

Edit
Rays makes more sense if you are just defaulting to 1
0
rgranlundAuthor Commented:
This is all making great sense to me now.  Both answers are perfect for what I am trying to do. However, I have one last piece that I am trying to understand and the script follows.  The second script findSum() works perfect.  However, I'm hug up on the first function findSubSum().

What I want it to do is to follow the class sum and multiply as it goes.  As it stands right now, it adds everything up as it goes.  What I want it to do is multiple by the values, (qty) not add.
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<meta charset="utf-8" />
<meta name="robots" content="noindex, nofollow" />

<script>
function findSubSum(){
    var arr = document.getElementsByClassName('qty');
    var tot = 0;
    for(var i=0;i<arr.length;i++){
        if(parseInt(arr[i].value))
            tot += parseInt(arr[i].value);
    }
    document.getElementById('sum').value = tot;
}

function findSum(){
	var myBox1 = document.getElementById('qty1').value;	
	var myBox2 = document.getElementById('qty2').value;

	var myBox2a = myBox2 != '' ? myBox2 : 1;

	var myBox3 = document.getElementById('qty3').value;

	var myBox3a = myBox3 != '' ? myBox3 : 1;

	var result = document.getElementById('result');	
	var myResult = myBox1 * myBox2a * myBox3a;
	result.value = myResult;
}
</script>

<title>HTML5 Page With JavaScript Form Input Control Summation</title>
</head>
<body>

<form method="POST" action="">
Qty1 : 	<input name="qty1" id="qty1" class="qty" onblur="findSubSum()" autocomplete="off" /><br>
Qty2 : 	<select name="qty2" id="qty2" class="qty" onblur="findSubSum()" autocomplete="off" >
			<option value="">Select an option...</option>
			<option value="1">1</option>
			<option value=".925">.925</option>
			<option value=".85">.85</option>
			<option value=".80">.80</option>
		</select>
		
	<br>
Qty3 : <select name="qty3" id="qty3" class="qty" onblur="findSubSum()" autocomplete="off" >
			<option value="">Select an option...</option>
			<option value="1.00">1.00</option>
			<option value="1.00">1.00</option>
			<option value=".85">.85</option>
			<option value=".80">.80</option>
		</select>
<br>
SUM So Far: <input readonly type="text" name="sum" id="sum"/><br /><br />
<input type="button" value="Preview" onclick="findSubSum()" /><br /><br /><br />
Total : <input readonly type="text" name="total" id="result"/>
<input type="button" value="Preview" onclick="findSum()" />

</form>

</body>
</html>                                      

Open in new window

I'm going to get this!
0
GaryCommented:
function findSubSum(){
	arr = document.getElementsByClassName('qty');
	tot = 1;
	for(var i=0;i<arr.length;i++){
	        tot *= arr[i].tagName === 'SELECT' ? parseFloat(arr[i].options[arr[i].selectedIndex].value) || 1 :parseFloat(arr[i].value)||1
	}
	document.getElementById('sum').value = tot;
}

Open in new window

0
rgranlundAuthor Commented:
@Gary but what if they are not just select , maybe there is a combination of Select, radio buttons, input boxes, that all have a value.
0
Ray PaseurCommented:
CodeAvengers JavaScript Class. Be sure you're up to speed on HTML first.  Just sayin'
0
GaryCommented:
The code is for dropdowns or inputs - doesn't matter

But for radios and to make it a bit more readable

function findSubSum(){
	arr = document.getElementsByClassName('qty');
	tot = 1;
	for(var i=0;i<arr.length;i++){
		if(arr[i].type=="text"){
			v=parseFloat(arr[i].value)||1
		}
		else if(arr[i].tagName === 'SELECT'){
			v=parseFloat(arr[i].options[arr[i].selectedIndex].value) || 1
		}
		else if(arr[i].checked){
			v=arr[i].value||1
		}
	        tot *= v
	}
	document.getElementById('sum').value = tot;
}

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Ray PaseurCommented:
It's traditional to award at least some of the points to the first correct answer, so I have to assume that you accidentally overlooked the code snippet here, which was a tested and working example showing exactly how to solve the problem.  In particular, line 14 of the snippet shows how to do multiplication in JavaScript.
http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28484523.html#a40221743
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.