By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,782 Members | 1,154 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,782 IT Pros & Developers. It's quick & easy.

Need help with simple price x quantity calculation

P: 8
I have a very simple price times quantity calculation.

The input is STWCORQuant:

Expand|Select|Wrap|Line Numbers
  1. <input name="STWCORQuant" class="contactitalicbold" id="STWCORQuant" onChange="javascript:STWCORPrice();" value="0" size="8" style="text-align: right; font-family: ver">
And the fucntion is STWCORPrice():

Expand|Select|Wrap|Line Numbers
  1. <script language="javascript" type="text/javascript">
  2.  
  3. function STWCORPrice() {
  4.         var price = 0;
  5.         var shipping = 0;
  6.         var total=0;
  7.         var qnty=document.all.STWCORQuant.value;
  8.  
  9.         if (qnty > 49 && qnty < 75){
  10.                     price = 23;
  11.                     shipping = 6.25;
  12.                     }
  13.  
  14.                 else if (qnty > 74 && qnty < 100){
  15.                     price = 17;
  16.                     shipping = 6.25;
  17.                         }
  18.  
  19.                 else if (qnty > 99 && qnty < 200){
  20.                     price = 14;
  21.                     shipping = 6.25;
  22.                         }
  23.  
  24.                 else if (qnty > 199 && qnty < 250){
  25.                     price = 13.75;
  26.                     shipping = 7.75;
  27.                         }
  28.  
  29.         total = (price * qnty)+shipping;        
  30.         document.all.STWCORIssueCost.value= '$ '+ total.toFixed(2);
  31.     }
  32.  
  33. </script>
  34.  
The output is this:

Expand|Select|Wrap|Line Numbers
  1. <td width="15%" id="STWCORIssueCost" Font Class="sidemenutextgrn" align="right">$0</Font></td>
It doesn't work, but looks like it should. When a quantity is input and the box is tabbed out of, nothing happens. I can't tell what is wrong....need help!

Thanks
Nov 19 '08 #1
Share this Question
Share on Google+
12 Replies


Dormilich
Expert Mod 5K+
P: 8,639
you should use document.getElementById() instead of document.all (that's IE syntax and not understood by many browsers).

rename onChange to onchange.

what is the value of qnty?

you could also call your function as STWCORPrice(this.value) (adjust function code...), so you don't need to fetch the value from the document tree.

regards
Nov 19 '08 #2

P: 8
you should use document.getElementById() instead of document.all (that's IE syntax and not understood by many browsers).

rename onChange to onchange.

what is the value of qnty?

you could also call your function as STWCORPrice(this.value) (adjust function code...), so you don't need to fetch the value from the document tree.

regards
I changed line five of the code per your suggestion:

Expand|Select|Wrap|Line Numbers
  1.  
  2. function STWCORPrice() {
  3.         var price = 0;
  4.         var shipping = 0;
  5.         var total=0;
  6.         var qnty=GetElementById(STWCORQuant);
  7.  
  8.         if (qnty > 49 && qnty < 75){
  9.                     price = 23;
  10.                     shipping = 6.25;
  11.                     }
  12.  
  13.                 else if (qnty > 74 && qnty < 100){
  14.                     price = 17;
  15.                     shipping = 6.25;
  16.                         }
  17.  
  18.                 else if (qnty > 99 && qnty < 200){
  19.                     price = 14;
  20.                     shipping = 6.25;
  21.                         }
  22.  
  23.                 else if (qnty > 199 && qnty < 250){
  24.                     price = 13.75;
  25.                     shipping = 7.75;
  26.                         }
  27.  
  28.         total = (price * qnty)+shipping;        
  29.         document.all.STWCORIssueCost.value= '$ '+ total.toFixed(2);
  30.     }
  31.  
  32.  
The value of qnty is the quantity input by the user (variable id is "STWCORQuant")

It still doesn't work...and the onchange vs. OnChange made no difference when I tried it (all the other OnChange events are capitalized the same way).

Have I used the GetElementById correctly?
Nov 19 '08 #3

Dormilich
Expert Mod 5K+
P: 8,639
you don't have. in your case you have to call it as
Expand|Select|Wrap|Line Numbers
  1. var qnty = document.getElementById("STWCORQuant");
to get the value of qnty add somewhere after its definition
Expand|Select|Wrap|Line Numbers
  1. alert(qnty);
this will show an alert box with qnty's value.

regards
Nov 20 '08 #4

P: 8
OK...we have made some progress...I fixed the code per your suggestion. It is now:
Expand|Select|Wrap|Line Numbers
  1. function STWCORPrice() {
  2.         var price = 0;
  3.         var shipping = 0;
  4.         var total=0;
  5.         var qnty=document.getElementById("STWCORQuant");
  6.         alert(qnty);
  7.  
  8.         if (qnty > 49 && qnty < 75){
  9.                     price = 23;
  10.                     shipping = 6.25;
  11.                     }
  12.  
  13.                 else if (qnty > 74 && qnty < 100){
  14.                     price = 17;
  15.                     shipping = 6.25;
  16.                         }
  17.  
  18.                 else if (qnty > 99 && qnty < 200){
  19.                     price = 14;
  20.                     shipping = 6.25;
  21.                         }
  22.  
  23.                 else if (qnty > 199 && qnty < 250){
  24.                     price = 13.75;
  25.                     shipping = 7.75;
  26.                         }
  27.  
  28.         total = (price * qnty)+shipping;        
  29.         document.all.STWCORIssueCost.value= '$ '+ total.toFixed(2);
  30.     }
  31.  
  32.  
However, when the OnChange is triggered with an input, the result is an alert box that simply says: [Object]

So, the Onchange is working to call the function, but the input variable STWCORQuant is not making it to the alert correctly in these two lines:

Expand|Select|Wrap|Line Numbers
  1. var qnty=document.getElementById("STWCORQuant");
  2. alert(qnty);
  3.  
We are closer, but there seems to be a problem calling the variable and using it in the definition of qnty.

The input line is:

Expand|Select|Wrap|Line Numbers
  1. <input name="STWCORQuant" class="contactitalicbold" id="STWCORQuant" onChange="javascript:STWCORPrice();" value="0" size="8" style="text-align: right; font-family: ver">
  2.  
Any suggestions?
Nov 20 '08 #5

gits
Expert Mod 5K+
P: 5,353
when you use:

Expand|Select|Wrap|Line Numbers
  1. var qnty = document.getElementById("STWCORQuant");
then qnty stores a reference to the node ... you just need to retrieve its value with:

Expand|Select|Wrap|Line Numbers
  1. var qnty = document.getElementById("STWCORQuant").value;
or alert it as:

Expand|Select|Wrap|Line Numbers
  1. alert(qnty.value)
kind regards
Nov 20 '08 #6

P: 8
Great! Now the alert correctly shows the value, but the output on the page remains $0 (nothing changes). The output code is:

Expand|Select|Wrap|Line Numbers
  1. document.all.STWCORIssueCost.value= '$ '+ total.toFixed(2);
  2.  
I know the code is now working up to this point because I "alerted" all the variables in the lines just before this and they all are correct.

I also tried:

Expand|Select|Wrap|Line Numbers
  1. document.all("STWCORIssueCost").value= '$ '+ total.toFixed(2);
  2.  
The place where it goes on the page is:

Expand|Select|Wrap|Line Numbers
  1.  <td width="15%" id="STWCORIssueCost" Font Class="sidemenutextgrn" align="right">$0</Font></td>
  2.  
Can you see why the total is not being displayed at STWCORIssueCost ?
Nov 20 '08 #7

acoder
Expert Mod 15k+
P: 16,027
Two issues:
1. Use document.getElementById() in place of document.all.
2. Use innerHTML in place of .value because a td element doesn't have a value.
Nov 20 '08 #8

P: 8
It works...thank you very much!
Nov 20 '08 #9

acoder
Expert Mod 15k+
P: 16,027
Glad it does! Post again if you have more questions and we'll be happy to help.
Nov 21 '08 #10

Dormilich
Expert Mod 5K+
P: 8,639
@acoder
I think, node.nodeValue should work also.

regards
Nov 21 '08 #11

acoder
Expert Mod 15k+
P: 16,027
Actually, it wouldn't. You'd need to use firstChild.nodeValue in place of innerHTML.
Nov 21 '08 #12

Dormilich
Expert Mod 5K+
P: 8,639
you're right, I forgot the child status of the text node.....

Dormi
(doing currently too much PHP)
Nov 21 '08 #13

Post your reply

Sign in to post your reply or Sign up for a free account.