Web Analytics Made Easy -
StatCounter Exploding values and calculating totals with javascript - CodingForum


No announcement yet.

Exploding values and calculating totals with javascript

  • Filter
  • Time
  • Show
Clear All
new posts

  • Exploding values and calculating totals with javascript

    Hello there,
    I have a slight problem with creating dynamic quotes. Basically I have two select boxes and need to calculate a total in real-time using javascript and insert into input

    First it needs to explode out the machine price and term years from the values and then calculate.

    Here an example:
    A machine costs £4000 and a term of 2 years(60 months). The calculation would be (4000/60)*3 = £200

    Please Help,

    <select name="machine">
    <option value="2005 - Almida XAS47 (660 Hours) £4000">2005 - Almida XAS47 (660 Hours) £4000</option>
    <select name="term">
    <option value="2 years (&pound;46.85)">2 years (&pound;46.85)</option>
    <input id="deposit" name="deposit"/>

  • #2
    Try this ...

    I'm not sure I understand your calculation or formula
    (2 years is 24 month, not 60 ???)
    and I added a few more selections in the drop downs for testing purposes
    but this should do as you request.
    <title>DD Calculations</title>
    <script type="text/javascript">
    function getSBox(IDS) {
      var obj = document.getElementById(IDS);
      return obj.value;
    function calc() {
      var sum = 0;
      var temp = '';
          temp = getSBox('Machine');
      var Machine = Number(temp);  
      if (isNaN(Machine) || (Machine == 0)) { sum = 0; } else { sum = Machine; }
          temp = getSBox('Term');
      var Term = Number(temp);  
      if (isNaN(Term) || (Term == 0)) { sum = 0; } else { sum += Term; }
      if (sum == 0) { 
    	temp = 0;
      } else {  
        temp = Machine / Term * 3;
      document.getElementById('deposit').value = temp.toFixed(2);
    <select id="Machine" name="machine" onchange="calc()">
     <option value="">Choose machine</option>
     <option value="4000">2005 - Almida XAS47 (660 Hours) £4000</option>
     <option value="5000">Something else £5000</option>
     <option value="6000">Something completely different  £6000</option>
    <select id="Term" name="term" onchange="calc()">
     <option value="">Choose term</option>
     <option value="12">1 years</option>
     <option value="18">1.5 years</option>
     <option value="24">2 years (&pound;46.85)</option>
     <option value="60">5 years</option>
    <input id="deposit" name="deposit" readonly/>
    Last edited by jmrker; Apr 1, 2009, 11:55 PM. Reason: Added 5 year option


    • #3
      Hey jmrker,
      Thanks very much for the reply..
      Your code works great but I have 1 problem. I need all of the information to remain in the select value so that I can email the machine details to myself on submit.
      <option value="2005 - Almida XAS47 (660 Hours) £4000">
      Thanks again


      • #4
        Javascript has the text property of the OPTION element

        So you can access the text as follows:-

        <input type="button" value="Get Text" onclick="alert(Machine.options[Machine.selectedIndex].text)">

        You talk about emailling the form data. Be aware that mailto is very unreliable, for a number of reasons not least that it will not work if JavaScript is disabled. If you want to be sure that the form data reaches you, you need to use a server-side formmail script.

        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.


        • #5
          Naaaw ...

          Just create an array with what you want to send, like:
          var InfoToSend = [
           ["No selection"],
           ["2005 - Almida XAS47 (660 Hours) £4000],
           ["Something else £5000],
           ["Something completely different  £6000]  // Note: no comma at end entry
          Then in the validation section before you mail the information,
          pick the appropriate message from the currently selected entry, like:
          // variable of form that will be mailed
          var MachineProduct = InfoToSend[document.getElementById('Machine').selectedIndex];
          Or do as 'PhillipM' has suggested.
          Last edited by jmrker; Apr 2, 2009, 03:53 PM. Reason: PhillipM posted a post before I could post my post


          • #6
            Thanks a lot guy


            • #7
              You're most welcome.
              I'm glad we could help.
              Good Luck!