[Last Call] Learn about multicloud storage options and how to improve your company's cloud strategy. Register Now

x
?
Solved

Why did this javascript code break?

Posted on 2008-10-08
17
Medium Priority
?
153 Views
Last Modified: 2011-10-19
Could some tell what I did wrong please?  I am using the attached javascript code, worked perfectly.  I needed to moved this code:
<td width="25%">Complete in:<br>
            <input type="radio" name="delivery" value="1" checked onclick="calc(this.form)"/>6-10 days<br>
            <input type="radio" name="delivery" value="2" onclick="calc(this.form)"/>3-5 days<br>
            <input type="radio" name="delivery" value="3" onclick="calc(this.form)"/>24 hrs.</td>
      </tr>

to another column near the top of the page.  It was previously under the section of code at the very bottom of the attached code snippet.  When I moved it, it stopped working.  I swear i just cut and pasted and added <br> at the end of the lines.

Can any see what I did wrong?
function calc(theForm) 
{
  var elements = theForm.elements;
  var total = 0;
  
  for(var i=0; i<elements.length; i++)
  {
    var element = elements[i];
    if(element.type == 'checkbox' && element.checked)
    {
        total += parseFloat(element.value);
    }
    else if(element.name=="delivery" && element.checked)
    {
        total *= parseFloat(element.value);
    }
  }
  document.getElementById('Q_51').value = total;
}
 
 
<tr>
            <td><label><?=$QUESTION['Q_52']?></label></td>
           <td>
               <input id="Q_52" type="checkbox" name="Q_52" <?=$onFocus?> <?=checkTheBox("Yes",$ANSWER['Q_52'])?> onclick="calc(this.form);" value="10">
               Concept Packaging&nbsp;&nbsp;
               <input id="Q_53" type="checkbox" name="Q_53" <?=$onFocus?> <?=checkTheBox("Yes",$ANSWER['Q_53'])?> onclick="calc(this.form);" value="20">
               Mechanical Card
               <input id="Q_54" type="checkbox" name="Q_54" <?=$onFocus?> <?=checkTheBox("Yes",$ANSWER['Q_54'])?> onclick="calc(this.form);" value="120">
               Mechanical Card
           </td>
     </tr>

Open in new window

0
Comment
Question by:justmelat
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 10
  • 5
  • 2
17 Comments
 
LVL 19

Expert Comment

by:LordOfPorts
ID: 22672011
Is it still within the FORM element?
0
 
LVL 1

Author Comment

by:justmelat
ID: 22672031
yes, still in the form element.
0
 
LVL 1

Author Comment

by:justmelat
ID: 22672039
it's just a column over, across from another field.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 1

Author Comment

by:justmelat
ID: 22672205
if i copy the code back to it's original position, it works.  What is this?
0
 
LVL 19

Expert Comment

by:LordOfPorts
ID: 22672212
The HTML structure might have been affected, try validating it at http://validator.w3.org/ it will show any errors such as unclosed element etc. that might prevent the Javascript from traversing the elements correctly.
0
 
LVL 82

Expert Comment

by:hielo
ID: 22672313
there's nothing wrong on what you posted. Most likely somewhere along the lines you got rid of some id reference or moved it outside the form tag.
0
 
LVL 1

Author Comment

by:justmelat
ID: 22673526
I promise Hielo, nothing, i just copied and pasted.

I'm going to try LordOfPorts idea and see if that shows anything
0
 
LVL 82

Expert Comment

by:hielo
ID: 22674117
>>I promise Hielo, nothing, i just copied and pasted.
I believe you, but bugs happen unintentionally. Try using firebug to see if it reports any js errors that may help you narrow down the problem.
0
 
LVL 1

Author Comment

by:justmelat
ID: 22676955
I have tried and checked everything, then i got the idea to just moved the code one line up instead of to the next column to see if it still worked.

so it appears to ONLY work in this order:

<!--check if different -->
     <tr>
            <td><label><?=$QUESTION['Q_52']?></label></td>
           <td>
               <input id="Q_52" type="checkbox" name="Q_52" <?=$onFocus?> <?=checkTheBox("Yes",$ANSWER['Q_52'])?> onclick="calc(this.form);" value="10">
               Concept Packaging&nbsp;&nbsp;
               <input id="Q_53" type="checkbox" name="Q_53" <?=$onFocus?> <?=checkTheBox("Yes",$ANSWER['Q_53'])?> onclick="calc(this.form);" value="20">
               Mechanical Card
               <input id="Q_54" type="checkbox" name="Q_54" <?=$onFocus?> <?=checkTheBox("Yes",$ANSWER['Q_54'])?> onclick="calc(this.form);" value="120">
               Mechanical Card
           </td>
     </tr>
     <!--Complete IN -->
       <tr><td>lskdfalskjfd</td>
       <td>
         Complete in:<br>
            <input type="radio" name="delivery" value="1" checked onclick="calc(this.form)" />6-10 days<br>
            <input type="radio" name="delivery" value="2" onclick="calc(this.form)" />3-5 days<br>
            <input type="radio" name="delivery" value="3" onclick="calc(this.form)" />24 hrs.
         </td></tr>

if i move that <!--Complete IN -->section anywhere else, it breaks.  Can anyone see why?  
0
 
LVL 82

Expert Comment

by:hielo
ID: 22678696
try:
function calc(theForm) 
{
  var elements = theForm.elements;
  var total = 0;
  var multiplier=1;
  for(var i=0; i<elements.length; i++)
  {
    var element = elements[i];
    if(element.type == 'checkbox' && element.checked)
    {
        total += parseFloat(element.value);
    }
    else if(element.name=="delivery" && element.checked)
    {
        multiplier = parseFloat(element.value);
    }
  }
  document.getElementById('Q_51').value = total*multiplier;
}

Open in new window

0
 
LVL 1

Author Comment

by:justmelat
ID: 22678910
ok I have adjusted this code and attached it in the txt file.  Everything is where I need it to appear on the screen.  The deadline calculation does not work.  Can anyone see what I am doing wrong?
deadlineNOtWorking.txt
0
 
LVL 1

Author Comment

by:justmelat
ID: 22678923
sorry Hielo, I did see yours, I will try it now.  Could you still look at that code please?
0
 
LVL 1

Author Comment

by:justmelat
ID: 22678950
Wow Hielo, that worked, what was the significance of that multiplier?
0
 
LVL 82

Accepted Solution

by:
hielo earned 1600 total points
ID: 22679165
>>what was the significance of that multiplier?
if the multiplier(delivery) were to be the very first element, then total would have zero when it gets to:
total *= parseFloat(element.value);

and the total would still be zero. Likewise if it were the second element, total would have only the value of the first element and on the next iteration total would be the value of the first element * delivery. Clearly you need to apply the multipliear AFTER all the values have been summed up.

>>so it appears to ONLY work in this order
That "solved" the problem :)

"Seeing" the code in action does make a huge difference.
0
 
LVL 1

Author Comment

by:justmelat
ID: 22679255
Hielo, thanks so much, you have no idea how I appreciate this.
0
 
LVL 1

Author Closing Comment

by:justmelat
ID: 31504378
BEyond Superior!!!!
0
 
LVL 82

Expert Comment

by:hielo
ID: 22679509
>>Hielo, thanks so much
you are welcome.

On another note, looking at the problem you are about to close here:
http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_23753700.html

I noticed you are NOT closing the TD tag.

Speaking of that problem, I noticed you offered 350ptx, yet you are a Premium Service Member which, if I am not mistaken, you have unlimited points - it will NOT cost you any more to offer 20pts than to offer 500pts. Yet, you don't seem to offer maximum points for most of the questions. I'm curious as to what criteria you use to assign points? A lot of experts try to answer questions just to meet their monthly 3000pts/month quota so that they maintain their free membership (I'm not one of them). Hence, to them, it's easier/faster to meet this goal by looking (most likely by using filters) specifically for the 500pt questions. Thus, you may get more prompt replies if you offer maximum points. As a matter of fact, from what I've seen, most Premium S. M. take this approach so they get their problems resolved in timely manner.

NO, I am not complaining.  I have a point or two too many:)
Take it as constructive criticism/advice.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
Since pre-biblical times, humans have sought ways to keep secrets, and share the secrets selectively.  This article explores the ways PHP can be used to hide and encrypt information.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

656 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question