www.webdeveloper.com
Results 1 to 6 of 6

Thread: calculating total with discount

  1. #1
    Join Date
    Sep 2008
    Posts
    12

    calculating total with discount

    Hello,
    i have a simple form that calculates the total of some checkboxes which works fine. Now, I need to offer a flat rate when 2 or more boxes are checked.
    Example: 1 box = 100, 2 boxes or more = 175.
    Finally, certain checkboxes must be exempt from the discount.
    I am new to JS and just to get the form i currently have to work, took me forever, so please be gentle!
    Here is my code:


    <script type="text/javascript">
    function calculate() {
    var elems = document.forms['form1'].elements;
    var total = 0;
    for(var i=0;i<elems.length;i++) {
    if (elems[i].checked) {total += +(elems[i].value);}
    }
    elems['total'].value = total;
    }
    </script>


    boxes where 2 or more must = 175:

    <input type="checkbox" name="checkbox_group_1[]" onclick="calculate()" value="100" title="Check here" />
    <input type="checkbox" name="checkbox_group_2[]" onclick="calculate()" value="100" title="Check here" />
    <input type="checkbox" name="checkbox_group_3[]" onclick="calculate()" value="100" title="Check here" />

    exempt boxes:

    <input type="checkbox" name="checkbox_group_4[]" onclick="calculate()" value="20" title="Check here" />
    <input type="checkbox" name="checkbox_group_5[]" onclick="calculate()" value="20" title="Check here" />

    thanks!

  2. #2
    Join Date
    Jul 2009
    Posts
    184
    Here's a new function calculate that will change total's value to whatever you want if two checkboxes get checked:
    Code:
    function calculate() {
        var elems = document.forms['form1'].elements;
        var total = 0;
        var c = 0
        for(var i=0;i<elems.length;i++) 
        {
            if (elems[i].checked) 
            {
    	    c++;
                // if both flat rate boxes are checked, apply your flat rate value to total
                if(c >= 2)
                {
                    total = 175; // whatever your flat rate is
                }
                // else just apply checkbox values to total
                else
                {
                    total += +(elems[i].value);
                }
            }
        }
        elems['total'].value = total;
    }
    Also, notice how much more readable the code is now that I've nested everything.
    Last edited by WestWeb; 12-07-2012 at 02:43 PM.

  3. #3
    Join Date
    Sep 2008
    Posts
    12
    hey,
    thanks that works great.
    How about exempting certain boxes from the flat rate? In other words, certain checked boxes would always add to the total and be exempt from the function.
    thanks again!

  4. #4
    Join Date
    Jul 2009
    Posts
    184
    Not tested, but I think you'll have to add id's to uniquely identify the input's you don't want to include, like:
    Code:
    <input type="checkbox" id="cb1" name="checkbox_group_1[]" onclick="calculate()" value="100" title="Check here" />
    Then just change your if statement, that looks for 2 or more checkboxes, to check that the inputs with id's are NOT checked, like:
    Code:
    if(c >= 2 && (!document.getElementById('cb1').checked) )
    {
        total = 175; // whatever your flat rate is
    }
    // else just apply checkbox values to total
    else
    {
        total += +(elems[i].value);
    }

  5. #5
    Join Date
    Sep 2008
    Posts
    12
    hey thanks,
    it didn't work for some reason, so i removed the check boxes for now.
    thanks though

  6. #6
    Join Date
    Jul 2009
    Posts
    184
    No problem: but, in the future, don't be afraid to show your code or anything like that. I may have been able to spot where you went wrong and it could be working. Feel free to do so if you want to get it working still.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles