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 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Aug 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Calculate running total

    I had a form with a running total working until I was asked to add some
    checkboxes. Here is what I have:

    http://www.bearzilla.net/test/Untitled-1.html

    The first section works, but I can't get any part of "Make Additional
    Donation" add to the total. You can view the source, but I left
    out the javascript that didn't work for me. Any help would be appreciated. Thanks.

  • #2
    Regular Coder ninnypants's Avatar
    Join Date
    Apr 2008
    Location
    Utah
    Posts
    504
    Thanks
    10
    Thanked 47 Times in 47 Posts
    Ok it took me a little bit and I changed your form a little but I have something for you. Use this function:
    Code:
    <script type="text/javascript">
    var rad = 0;
    function total(){
    	regX=/[0-9]/i;
            // use the form values to set the variables
    	val1 = document.frm.qty1.value;
    	val2 = document.frm.qty2.value;
    	val3 = rad;
    	val4 = document.frm.other.value;
            // this section tests each variable to see if
            // if it is set and is a number if so it handles
            // it as needed
    	if(val1 && regX.test(val1)){
    		p1 = val1*25;
    		document.frm.subtotal1.value = p1;
    	}
    	if(val2 && regX.test(val2)){
    		p2 = val2*45;
    		document.frm.subtotal2.value = p2;
    	}
    	if(val3 && regX.test(val3)){
    		p3 = val3;
    	}
    	if(val4 && regX.test(val4)){
    		p4 = val4;
    	}
            // this last part just adds everything togeather
            // and sets it to what needs it
    	tot = p1+p2+p3+p4;
    	document.frm.finaltotal.value = tot;
    	document.frm.finalqty.value = val1 + val2;
    }
    </script>
    With this form:
    Code:
    <!-- I changed your form name because form is a dangerous word to use-->
    <form method="POST" name="frm">
      		<div class="optional">
              <label for="qty1"><strong>Lunch Only:<br />
              </strong></label>
              qty
              <input name="qty1" type="text" onchange="total();" class="inputText" id="qty1"  size="3" value="0" />
    
              <strong>@</strong>
              $25  ea = $
    <!-- on inputs that hold totals I added some code that when the element is focused on it switches to the element that populates it-->
              <input name="subtotal1" type="text" size="8" onfocus="document.form.qty1.focus();" class="inputText" />
    		</div>
            <div class="optional">
              <label for="qty2"><strong>Lunch and Dinner:<br />
    
              </strong></label>
              qty
              <input name="qty2" type="text" onchange="total();" class="inputText" id="qty2"  size="3" value="0" />
              <strong>@</strong>
              $45  ea = $
              <input name="subtotal2" type="text" size="8" onfocus="document.form.qty2.focus();" class="inputText" />
    
            <br />
    		</div>
            <br>
            Make additional donation:
            <br>
    <!-- I changed these to radio buttons so that people don't accidentally add more than they mean to and I also use them to set the value
    of the rad variable that is used in total()-->
            <input type="radio" id='200' name="addit" onclick="rad=200;total();"  >$200<br>
    <input type="radio" id='100' name="addit"  onclick="rad=100;total();">$100<br>
    <input type="radio" id='50' name="addit" onclick="rad=50;total();">$50<br>
    <input type="radio" id='25' name="addit" onclick="rad=25;total();">$25<br>
    
    <input name='other' type="text" onchange="total();" value="0" size="6">
    Other<br>
    <br>
    
     <input name="finaltotal" type="text" value="" size="10" onfocus="document.form.qty1.focus();" class="inputText" id="finaltotal"/>
    <input name="finalqty" type="hidden" value="" size="10" readonly="readonly" class="inputText" id="finalqty"/>
      </form>
    Last edited by ninnypants; 08-09-2008 at 05:05 PM.

  • #3
    New to the CF scene
    Join Date
    Aug 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you, but I tried your code and the final total field doesn't seem to work:

    http://www.bearzilla.net/test/Untitled-3.html

  • #4
    Senior Coder rangana's Avatar
    Join Date
    Feb 2008
    Location
    Cebu City, Philippines
    Posts
    1,752
    Thanks
    65
    Thanked 372 Times in 365 Posts
    From the link given on post#1. Please follow these steps:
    • Change this part:
      Code:
      <input type="checkbox" id='200' value="200"  onclick="compute(this.form)">$200<br>
      <input type="checkbox" id='100' value="100" onclick="compute(this.form)">$100<br>
      <input type="checkbox" id='50' value="50" onclick="compute(this.form)">$50<br>
      <input type="checkbox" id='25' value="25" onclick="compute(this.form)">$25<br>
      <input name='other' type="text" onClick="compute(this.form)" value="" size="6">
      into:
      Code:
      <input type="checkbox" id='200' value="200"  onclick="if(this.checked==true)compute1(this.form,this.value,'1');else compute1(this.form,this.value,'0');">$200<br>
      <input type="checkbox" id='100' value="100" onclick="if(this.checked==true)compute1(this.form,this.value,'1');else compute1(this.form,this.value,'0');">$100<br>
      <input type="checkbox" id='50' value="50" onclick="if(this.checked==true)compute1(this.form,this.value,'1');else compute1(this.form,this.value,'0');">$50<br>
      <input type="checkbox" id='25' value="25" onclick="if(this.checked==true)compute1(this.form,this.value,'1');else compute1(this.form,this.value,'0');">$25<br>
      <input name='other' type="text" onclick="if(this.checked==true)compute1(this.form,this.value,'1');else compute1(this.form,this.value,'0');" value="" size="6">
    • And have this function:
      Code:
      function compute1(frm,e,todo)
      /* compute1 function takes three parameters. //
      	* First parameter is the form that the element is within. Expected input should be "this.form"
      	* Second parameter is to accept the value assigned to the checkbox
      	* Last parameter is to instruct the script what to do. Values should either be 1/0. 1=addition and 0=subtraction
      // End notes */
      {
      var tot=Number(frm.finaltotal.value);
      frm.finaltotal.value=(todo!=1)?tot-Number(e):tot+Number(e);
      }


    Please read comments. Parameters are explained. Hope that helps.
    Learn how to javascript at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph

  • #5
    Regular Coder ninnypants's Avatar
    Join Date
    Apr 2008
    Location
    Utah
    Posts
    504
    Thanks
    10
    Thanked 47 Times in 47 Posts
    Sorry the problem was in the last two lines. I forgot to assign it to the value
    Code:
    document.frm.finaltotal.value = tot;
    document.frm.finalqty.value = val1 + val2;

  • #6
    New to the CF scene
    Join Date
    Aug 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks rangana....the checkboxes work just as I wanted. The only thing is the "Other" field that I didn't add to the total. Thanks again.

    http://www.bearzilla.net/test/Untitled-4.html


  •  

    Posting Permissions

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