We help IT Professionals succeed at work.

Javascript VAR Syntax

Robert Granlund
on
417 Views
Last Modified: 2014-08-01
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

Comment
Watch Question

run the page and post the output

Author

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

CERTIFIED EXPERT
Expert of the Year 2014
Top Expert 2014

Commented:
What's the actual problem?
looks ok, does it work as expected?
Most Valuable Expert 2011
Author of the Year 2014

Commented:
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.
https://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.
CERTIFIED EXPERT
Expert of the Year 2014
Top Expert 2014

Commented:
The php is creating the Js conditions.
I see no reason to use ajax for what his code is doing

Author

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

CERTIFIED EXPERT
Expert of the Year 2014
Top Expert 2014
Commented:
This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION
Most Valuable Expert 2011
Author of the Year 2014

Commented:
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.

Gain unlimited access to on-demand training courses with an Experts Exchange subscription.

Get Access
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Empower Your Career
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE

Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Unlock the solution to this question.
Join our community and discover your potential

Experts Exchange is the only place where you can interact directly with leading experts in the technology field. Become a member today and access the collective knowledge of thousands of technology experts.

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.