Member Avatar for maxijazz20
maxijazz20 0 Newbie Poster

Hi there,
I am trying to come up with an instant price quote calculator in javascript.
it would be a simple one with six fields:

Quantity of mounts
Outside Top = Free type box
Outside Side = Free type box
Window Top = Free type box
Window Edge = Free type box
Colour = Free type box
A button to calulate the total
The results to display total a price with a formula of “outside top multiplied by 0.10 plus outside side multiplied by 0.10”
The rest of the options are just information for me.
If at all possible I would like the results button to email me the value of the fields at the time of displaying the price on screen for the customer.
I will then try to add a buy it now button at a later date.

I did see something similar to what I want on a forum like this, I have pasted it below. I don’t know if it can be altered to what I need.

Thanks in advance for any help
Ric

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Calc</title>
  6. <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
  7. <script type="text/javascript">
  8. <!--
  9. $(document).ready(function() {
  10. $('#calculateTotal').click(function() {
  11. var shirtsPrice = 10.50, perColorPrice = 5.99;
  12. var inputNum_of_Shirts = $('#shirts').val();
  13. var inputNum_of_FColor = $('#colorsOnFront').val();
  14. var inputNum_of_BColor = $('#colorsOnBack').val();
  15. var totalCost = (inputNum_of_Shirts*parseFloat(shirtsPrice))
  16. +(parseFloat(perColorPrice)*inputNum_of_FColor)
  17. +(parseFloat(perColorPrice)* inputNum_of_BColor );
  18. var perShirtCost = (parseFloat(shirtsPrice))
  19. +(parseFloat(perColorPrice)*inputNum_of_FColor)
  20. +(parseFloat(perColorPrice)*inputNum_of_BColor);
  21. $('#total').html(formatCurrency(totalCost));
  22. $('#perShirt').html(formatCurrency(perShirtCost));
  23. $('#result').css('display', 'block');
  24. });
  25. });
  26. // This Function I have searched from Web
  27. function formatCurrency(strValue)
  28. {
  29. strValue = strValue.toString().replace(/\$|\,/g,'');
  30. dblValue = parseFloat(strValue);
  31. blnSign = (dblValue == (dblValue = Math.abs(dblValue)));
  32. dblValue = Math.floor(dblValue*100+0.50000000001);
  33. intCents = dblValue%100;
  34. strCents = intCents.toString();
  35. dblValue = Math.floor(dblValue/100).toString();
  36. if(intCents<10)
  37. strCents = "0" + strCents;
  38. for (var i = 0; i < Math.floor((dblValue.length-(1+i))/3); i++)
  39. dblValue = dblValue.substring(0,dblValue.length-(4*i+3))+','+
  40. dblValue.substring(dblValue.length-(4*i+3));
  41. return (((blnSign)?'':'-') + '$' + dblValue + '.' + strCents);
  42. }
  43. -->
  44. </script>
  45. </head>
  46. <body>
  47. <form id="calc" name="calc">
  48. <p>
  49. <input id="shirts" name="shirts" type="text">
  50. <label for="shirts">Number of Shirts</label>
  51. </p>
  52. <p>
  53. <input id="colorsOnFront" name="colorsOnFront" type="text">
  54. <label for="colorsOnFront">Number of Colors on Front</label>
  55. </p>
  56. <p>
  57. <input id="colorsOnBack" name="colorsOnBack" type="text">
  58. <label for="colorsOnBack">Number of Colors on Back</label>
  59. </p>
  60. <p><input name="calculateTotal" id="calculateTotal" type="button" value="Calculate Total" /></p>
  61. <div id="result" style="display:none;"><strong>Total:</strong> <span id="total"></span> <strong>Per Shirt:</strong> <span id="perShirt"></span></div>
  62. </div>
  63. </form>
  64. </body>
  65. </html>
  • 1 Contributor
  • 0 Replies
  • 58 Views
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.