Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jun 2013
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    I made a calculator, but it doesn't do decimals and I'm not sure how to fix it.

    Hi all, was wondering if I could get a spot of help here. I'm not a JavaScript coder, but I've been tasked with updating the website at my first job and I'm trying to make a good impression. I've been researching, but have run into a wall with something that I'm sure would be considered embarrassingyl simple. If anyone could give me some tips as to what I'm doing wrong, I'd love them forever.

    Basically, I need to add a sort of shopping-cart calculator to the site. There's a list of products, and beside each product, a "Quantity" field. The calculator knows that Product X is $2.70 and Product Y is $4, so when the user hits the 'calculate total' button, it multiplies each product's price by its quantity, adds them all up, and gives a total figure.

    That's it. Simple, right?

    Well, here's what I've done so far. Here's the first section, which defines the Cal function.

    Code:
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    
    function Cal(obj){
     var args=Cal.arguments,frm=args[0].form,nu,tot=0;
     var values=[];
     for (var ip,z0=1;z0<args.length-1;z0++){
      ip=frm[args[z0]];
      ip.value=ip.value.replace(/\D/g,'');
      values.push([ip.value,ip.parentNode.className]);
     }
     if (values[0][0].length>0){
      nu=values[0][0];
      tot=nu*values[0][1];
      for (var z1=1;z1<values.length;z1++){
       if (values[z1][0]){
        tot+=values[z1][0]*values[z1][1]*nu
       }
      }
     }
     frm[args[args.length-1]].value='$'+tot;
    }
    /*]]>*/
    </script>
    And here's the form itself. The top part lists the products (only two, to keep the illustration simple) and the bottom part is the Calculate Totals button.

    Code:
    <form>
    <table width="100%">
    <tr><td>Product One</td>
    	<td style="text-align:right;"><span class="55">	Qty:<input name="two" size="5" /></span></td></tr>
    <tr><td>Product Two</td>
    	<td style="text-align:right;"><span class="84"> Qty:<input name="three" size="5" />/span></td></tr>
    
    
    <tr><td></td>
    <td style="text-align:right;"><input type="button" name="" value="Calculate Total" onmouseup="Cal(this,'two','three','total');" />
    <input name="total" /></form></td></tr></table>

    Now, what I've got there actually does work perfectly fine -- except that it doesn't calculate decimals, and that's a problem for me. Some of the prices need to be things like $3.70, and that calculator doesn't understand that.

    My initial idea was to simply list all the prices in cents, and have the Cal function divide by 100 as its last step. But I'm not sure how to actually add that to the code -- nothing I've tried works.

    Could anyone tip me off as to how I might do that? I'd be grateful.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,037
    Thanks
    203
    Thanked 2,539 Times in 2,517 Posts
    ip.value=ip.value.replace(/\D/g,'');

    Says delete any character which is not a digit (0-9). That will include a decimal point.

    Change it to

    ip.value=ip.value.replace(/[^0-9\.]/g,'');

    which means delete any charcater not 0-9 or decimal point.

    Quizmaster: Which pear-shaped organ stores bile?
    Contestant: The vulva

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •