Javascript VAR Syntax

I'm creating a Javascript var and I'm not sure I have all of the syntax correct.  Can you please have a look at the following and let me know what additional info you need to answer my question or let me know how to better right the following
<script>
	var myBox5 = document.getElementById('addon-28-custom-price[type-of-bicycle]').value;
		<?php
			$type_bike1 = $pdo->prepare($bike1);
			$elseif="";
			try {
			$type_bike1->execute();
			$type1 = $type_bike1->fetchAll();
			
			foreach ($type1 as $bt1)	{
					$bike_type1 = $bt1->type;
					$pd1 = $bt1->physical_damage;
					$bl1 = $bt1->bicycle_liability;
					$med1 = $bt1->medical_payment;
					$mtr1 = $bt1->motor_vehicle_contact;

					$elseif.="else if (myBox5 == '" . $bike_type1 . "') { myBox5a =" . $pd1 . ", myBox5alia =" . $bl1 . ", myBox5aMed =" . $med1 . ", myBox5aMtr =" . $mtr1 . "}";

			}
			echo substr($elseif,4)?>
			else {
				myBox5a = 1, myBox5alia = 1, myBox5aMed = 1, myBox5aMtr = 1  
			}
		<?php
			
		}
		catch(PDOException $b) {
   			echo 'ERROR: ' . $b->getMessage();
		}	
	?>
</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.

Randy PooleCommented:
run the page and post the output
0
rgranlundAuthor Commented:
@Randy, I think it looks good:
<script>
function findSum(){
var baseOne = document.getElementById('addon-28-custom-price[custom-price]').value;
var myBox1 = document.getElementById('addon-28-custom-price[my-deductible]').value;
var myBox2 = document.getElementById('addon-28-custom-price[bicycle-liability]').value;
var myBox2a = myBox2 != '' ? myBox2 : 0;
var myBox3 = document.getElementById('addon-28-custom-price[medical-payments]').value;
var myBox3a = myBox3 != '' ? myBox3 : 0;
var myBox4 = document.getElementById('addon-28-custom-price[vehicle-contact]').value;
var myBox4a = myBox4 != '' ? myBox4 : 0;
var myBox5 = document.getElementById('addon-28-custom-price[type-of-bicycle]').value;
if (myBox5 == 'BMX') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.10, myBox5aMtr =1.00}else if (myBox5 == 'Electric / Pedal Assist') { myBox5a =1.10, myBox5alia =1.10, myBox5aMed =1.10, myBox5aMtr =1.00}else if (myBox5 == 'Hybrid / Cruiser') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00}else if (myBox5 == 'Mountain') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.10, myBox5aMtr =1.00}else if (myBox5 == 'Recumbent') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00}else if (myBox5 == 'Road / Track') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00}else if (myBox5 == 'Tandem') { myBox5a =1.00, myBox5alia =1.10, myBox5aMed =1.10, myBox5aMtr =1.10}else if (myBox5 == 'Tricycle') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00}else if (myBox5 == 'Triathlon') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00}else if (myBox5 == 'Fat Bike') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00} else {
myBox5a = 1, myBox5alia = 1, myBox5aMed = 1, myBox5aMtr = 1
}
var myBox6 = document.getElementById('addon-28-custom-price[type-of-material]').value;
if (myBox6 == 'Aluminum') { myBox6a =1.05 }else if (myBox6 == 'Carbon Fiber') { myBox6a =1.10 }else if (myBox6 == 'Steel') { myBox6a =1.00 }else if (myBox6 == 'Titanium') { myBox6a =1.05 }else if (myBox6 == 'Wood') { myBox6a =1.00 }else if (myBox6 == 'Other') { myBox6a =1.00 } else {
myBox6a =1
}
var myBox7 = document.getElementById('addon-28-custom-price[usage]').value;
if (myBox7 == 'Casual') { myBox7a =1.00 }else if (myBox7 == 'Fitness') { myBox7a =1.00 }else if (myBox7 == 'Commuter') { myBox7a =1.10 }else if (myBox7 == 'Competitive') { myBox7a =1.10 } else {
myBox7a =1
}
var myBox8 = document.getElementById('addon-28-custom-price[association-membership-1]').value;
var myBox9 = document.getElementById('addon-28-custom-price[association-membership-2]').value;
if(myBox8 == 'yes' || myBox9 == 'yes') { myBox10 = "0.90" }
else { myBox10 = "1" }
var result = document.getElementById('result');
var base = parseFloat(baseOne) * parseFloat(myBox1) * parseFloat(myBox5a) * parseFloat(myBox6a) * parseFloat(myBox7a);
var baseLiable= parseFloat(myBox2a) * parseFloat(myBox5a) * parseFloat(myBox6a) * parseFloat(myBox7a);
var baseMed= parseFloat(myBox3a) * parseFloat(myBox5a) * parseFloat(myBox6a) * parseFloat(myBox7a);
var baseContact= parseFloat(myBox4a) * parseFloat(myBox5a) * parseFloat(myBox6a) * parseFloat(myBox7a);
var myResultSub = parseFloat(base) + parseFloat(baseLiable) + parseFloat(baseMed) + parseFloat(baseContact);
var myResult = parseFloat(myResultSub) * parseFloat(myBox10);
result.innerHTML = myResult.toFixed(2);
}
</script>

Open in new window

0
GaryCommented:
What's the actual problem?
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.

Randy PooleCommented:
looks ok, does it work as expected?
0
Ray PaseurCommented:
It looks like you've got JavaScript mixed up with PHP.  JavaScript runs on the client machine.  PHP runs on the server.  By the time JavaScript starts running, the server is disconnected and PHP has "gone to sleep."  You might be better off using an AJAX design for this.  I can't be sure without seeing it "in situ" but it feels like it should be AJAX when I look at the code.  To learn more about HTTP client/server protocols, please read this article and then post back with any questions.
http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/A_11271-Understanding-Client-Server-Protocols-and-Web-Applications.html

Also, when you speak of "creating a JavaScript var" you are speaking of creating a pointer to an element in the dom.
0
GaryCommented:
The php is creating the Js conditions.
0
Randy PooleCommented:
I see no reason to use ajax for what his code is doing
0
rgranlundAuthor Commented:
So, it is ok to write it this way?

if (myBox5 == 'BMX') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.10, myBox5aMtr =1.00}else if (myBox5 == 'Electric / Pedal Assist') { myBox5a =1.10, myBox5alia =1.10, myBox5aMed =1.10, myBox5aMtr =1.00}else if (myBox5 == 'Hybrid / Cruiser') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00}else if (myBox5 == 'Mountain') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.10, myBox5aMtr =1.00}else if (myBox5 == 'Recumbent') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00}else if (myBox5 == 'Road / Track') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00}else if (myBox5 == 'Tandem') { myBox5a =1.00, myBox5alia =1.10, myBox5aMed =1.10, myBox5aMtr =1.10}else if (myBox5 == 'Tricycle') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00}else if (myBox5 == 'Triathlon') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00}else if (myBox5 == 'Fat Bike') { myBox5a =1.00, myBox5alia =1.00, myBox5aMed =1.00, myBox5aMtr =1.00} else {
myBox5a = 1, myBox5alia = 1, myBox5aMed = 1, myBox5aMtr = 1
}

Open in new window

0
GaryCommented:
That code is fine
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:
I think "ok" is relative to whatever standards you want.  I might be inclined to write it this way:

     if (myBox5 == 'BMX')                     { myBox5a = 1.00, myBox5alia = 1.00, myBox5aMed = 1.10, myBox5aMtr = 1.00 }
else if (myBox5 == 'Electric / Pedal Assist') { myBox5a = 1.10, myBox5alia = 1.10, myBox5aMed = 1.10, myBox5aMtr = 1.00 }
else if (myBox5 == 'Hybrid / Cruiser')        { myBox5a = 1.00, myBox5alia = 1.00, myBox5aMed = 1.00, myBox5aMtr = 1.00 }
else if (myBox5 == 'Mountain')                { myBox5a = 1.00, myBox5alia = 1.00, myBox5aMed = 1.10, myBox5aMtr = 1.00 }
else if (myBox5 == 'Recumbent')               { myBox5a = 1.00, myBox5alia = 1.00, myBox5aMed = 1.00, myBox5aMtr = 1.00 }
else if (myBox5 == 'Road / Track')            { myBox5a = 1.00, myBox5alia = 1.00, myBox5aMed = 1.00, myBox5aMtr = 1.00 }
else if (myBox5 == 'Tandem')                  { myBox5a = 1.00, myBox5alia = 1.10, myBox5aMed = 1.10, myBox5aMtr = 1.10 }
else if (myBox5 == 'Tricycle')                { myBox5a = 1.00, myBox5alia = 1.00, myBox5aMed = 1.00, myBox5aMtr = 1.00 }
else if (myBox5 == 'Triathlon')               { myBox5a = 1.00, myBox5alia = 1.00, myBox5aMed = 1.00, myBox5aMtr = 1.00 }
else if (myBox5 == 'Fat Bike')                { myBox5a = 1.00, myBox5alia = 1.00, myBox5aMed = 1.00, myBox5aMtr = 1.00 }
else                                          { myBox5a = 1.00, myBox5alia = 1.00, myBox5aMed = 1.00, myBox5aMtr = 1.00 }

Open in new window

When you line things up carefully, you can make a quick visual scan to catch code errors more quickly (they are usually typographical and stand out).  And you can see that, eg, myBox5a is almost always the same, so there is no need to write code to set it conditionally.  You could just set it once at the top and only change it if the selection indicates a need to change.  

And when you look at it this way you can kind of see that the application is now dependent on a programming change and a redeployment if any of these values change.  That means a testing cycle with software developers involved.  It's an expensive way to build applications and an even more expensive way to go forth into the future.  If it were my app, I would want to have these values in a data base table so that the business unit could do table maintenance without making direct changes to the JavaScript.  Hence my thinking that this might make for a good AJAX application.
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.