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

    Sum values from form fields

    Hello,
    I am working on a script, but I'm really not an expert. Any help will be highly appreciated.
    Description:
    I have items - some have option for adding an amount and some not (because they can be only 1).
    I need when the checkboxes are clicked (choosing an item) the total to be displayed in the text field at the bottom.
    the single items work fine, but when i choose the one that can be added amount, it deletes the total from the first ones.
    Below is the script so you can see what I'm trying to explain:

    Code:
    <html><head>
    <script type="text/JavaScript"><!-- 
    
            var Cost;
            var Amount = 0;
    
    function getNumber() {	
    		Amount = document.orderform.EVT_01.value;
    		}
    function tally()        {
            Cost = 0;
            if (document.orderform.Item1.checked) { Cost = Cost + 40; }
            if (document.orderform.Item2.checked) { Cost = Cost + 30; }
            if (document.orderform.Item3.checked) { Cost = 100 * Amount; }
    		
    Cost = dollar(Cost);
    document.orderform.Total.value = "$" + Cost;
            }
    
    function dollar (amount)
    {
            amount = parseInt(amount * 100);
            amount = parseFloat(amount/100);
            if (((amount) == Math.floor(amount)) && ((amount - Math.floor (amount)) == 0))
            {
                    amount = amount + ".00"
                    return amount;
            }
            if ( ((amount * 10) - Math.floor(amount * 10)) == 0)
            {
                    amount = amount + "0";
                    return amount;
            }
            if ( ((amount * 100) - Math.floor(amount * 100)) == 0)
            {
                    amount = amount;
                    return amount;
            }
            return amount;
    }
    
    //--></script>
    </head>
    <body><form name="orderform">
    <table width="500" border="0" cellspacing="1" cellpadding="1">
    <tr><td width="167"><input type="checkbox" name="Item1" value="Item1_chosen" onClick="tally()" />AAA</td>
    <td width="51">$40</td>
    <td width="109">&nbsp;</td></tr>
    <tr><td><input type="checkbox" name="Item2" value="Item2_chosen" onClick="tally()" />BBB</td>
    <td>$30</td>
    <td>&nbsp;</td></tr>
    <tr><td colspan="3">&nbsp;</td></tr>
    <tr><td><input type="checkbox" name="Item3" value="Item3_chosen" onClick="tally()" /><span class="EventPrice"><a href="#" title=" CCC " 
    
    target="_blank">CCC</a></span></td>
    <td><span class="EventPrice">$100</span></td>
    	
    <td>Amount:<input name="EVT_01" type="text" id="EVT_01" value="0" size="3" maxlength="3" onChange="getNumber()" /></td></tr>
    <tr>
    <td colspan="3">&nbsp;</td></tr>
    <tr><td>Total:<input name="Total" type="text" value="$0" size="7" readonly="readonly"></td>
    <td colspan="2">&nbsp;</td></tr>
    </table></form></body></html>
    Thanks in advance for your help!

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,907
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Javascript is case sensitive. amount != Amount.

    Suggest you use find and replace to change all instances of Amount to amount and all instances of Cost to cost. Then it works.

    Also:

    if (document.orderform.Item3.checked) { Cost = Cost + (100 * amount); }

    BTW, the time to say "thanks" is afterwards, not beforehand which gives the impression that you take other people's unpaid assistance for granted. Or as British politician Neil Kinnock put it, "Don't belch before you have had the meal." Prefer to use "please" beforehand and if you find a response helpful then you can use the "Thank User For This Post" button.
    Last edited by Philip M; 09-12-2008 at 08:14 PM.

  • Users who have thanked Philip M for this post:

    stefig (09-12-2008)

  • #3
    New to the CF scene
    Join Date
    Sep 2008
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks, Philip,
    You're right about the thanks in advance. :-)
    But now I can surely do say it, because you really helped.
    I have just one small issue left.
    Now, on "CCC" item, if you check the box first and then add Amount it doesn't change.
    You have to put the amount and then to check the box to work fine.
    Is there a way to make it the opposite?
    (I mean check the box first and then when add amount the total will change).

  • #4
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,072
    Thanks
    38
    Thanked 498 Times in 492 Posts

    Lightbulb Consider this ...

    I think you can do what you want and simplify it somewhat with this.
    PHP Code:
    <html>
    <
    head>
    <
    script type="text/JavaScript">
    // From: http://codingforums.com/showthread.php?t=148723

            
    var cost;
            var 
    amount 0;

    function 
    getNumber() {    
            
    amount document.orderform.EVT_01.value;
            }
    function 
    tally()        {
            
    cost 0;
            if (
    document.orderform.Item1.checked) { cost cost 40; }
            if (
    document.orderform.Item2.checked) { cost cost 30; }
            if (
    document.orderform.Item3.checked) { cost 100 amount; }
            
            
    cost cost.toFixed(2);
            
    document.orderform.Total.value "$" cost;
            }
    </script>
    </head>
    <body>
    <form name="orderform">
    <table width="500" border="0" cellspacing="1" cellpadding="1">
    <tr>
    <td width="167"><input type="checkbox" name="Item1" value="Item1_chosen" onClick="tally()" />AAA</td>
    <td width="51">$40</td>
    <td width="109">&nbsp;</td>
    </tr>

    <tr>
    <td><input type="checkbox" name="Item2" value="Item2_chosen" onClick="tally()" />BBB</td>
    <td>$30</td>
    <td>&nbsp;</td>
    </tr>

    <tr>
    <td colspan="3">&nbsp;</td>
    </tr>

    <tr>
    <td><input type="checkbox" name="Item3" value="Item3_chosen" onClick="tally()" />
    <span class="EventPrice">
    <a href="#" title=" CCC " target="_blank">CCC</a></span>
    </td>
    <td><span class="EventPrice">$100</span></td>
        
    <td>Amount:<input name="EVT_01" type="text" id="EVT_01" value="0" size="3" maxlength="3"
     onChange="getNumber();tally()" /></td>
    </tr>

    <tr>
    <td colspan="3">&nbsp;</td>
    </tr>

    <tr>
    <td>Total:<input name="Total" type="text" value="$0" size="7" readonly="readonly"></td>
    <td colspan="2">&nbsp;</td>
    </tr>
    </table>
    </form>
    </body>
    </html> 
    Note the removal of the 'dollar' function
    which is replaced with the cost.toFixed(2) function.

    Note that you could also replace:
    PHP Code:
    <td>Amount:<input name="EVT_01" type="text" id="EVT_01" value="0" size="3" maxlength="3"
     
    onChange="getNumber();tally()" /></td
    with:
    PHP Code:
    <td>Amount:<input name="EVT_01" type="text" id="EVT_01" value="0" size="3" maxlength="3"
     
    onBlur="getNumber();tally()" /></td
    Good Luck!
    Last edited by jmrker; 09-13-2008 at 05:11 AM.

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,907
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Correction:-

    if (document.orderform.Item3.checked) { cost = cost + (100 * amount) }


  •  

    Posting Permissions

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