#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2013
    Posts
    1
    Rep Power
    0

    Adding different values of different input types


    I'm trying to make a registration form, and one part of that is it needs to be able to add the values of input types and displays it at the bottom.

    This is what I've done for the JS;


    javascript Code:
    //Calculate checkbox 
    var total = 0; 
     
    function ShowTotal(obj){ 
     
       var price; var i; 
       if (obj.checked)                              
          total = total + eval(obj.value); 
       else                                          
          total = total - eval(obj.value); 
     
       return; 
    } 
     
    //Calculate radio 
    var pro = 0; 
     
      function ShowProTotal(obj) 
      { 
        var price; var i; 
        if (obj.checked) 
          pro = pro + eval(obj.value); 
        else 
          pro = pro - eval(obj.value); 
        return; 
      } 
     
    //Calculates total cost 
     function getTotal(){ 
         var totalCost = ShowTotal() + ShowProTotal(); 
     
         document.getElementById("regform").cost.value = totalCost; 
         }


    And this is the HTML parts of it which are affected by it;

    javascript Code:
    //Checkbox 
            <dd> 
                <label> 
                    <input name="attend" value="50.00" type="checkbox" onclick="getTotal()" />Monday 
                </label> 
                <label> 
                    <input name="attend" value="50.00" type="checkbox" onclick="getTotal()" />Tuesday 
                </label> 
                <label> 
                    <input name="attend" value="50.00" type="checkbox" onclick="getTotal()" />Wednesday 
                </label> 
            </dd> 
     
     
    //Radio buttons 
     
            <dd> 
                <label> 
                    <input name="proceedings" value="50" type="radio" checked="checked" onclick="getTotal();" />Yes 
                </label> 
                <label> 
                    <input name="proceedings" value="0" type="radio" onclick="getTotal();" />No 
                </label> 
            </dd> 
     
     
    //Where result should be displayed 
            <dd> 
                <input id="cost" name="cost" class="formtextfield" type="text" /> 
            </dd>


    I've omitted the rest of the code out for clarity, I'm not entirely sure where the problem is because when I try it with just the Checkbox it seems to be displaying the result fine. I'm probably doing something very wrong with the funtions.

    Any help on this would be very much appreciated. Thanks
  2. #2
  3. --
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2012
    Posts
    3,959
    Rep Power
    1014
    Hi,

    first of all: Congratulations on using the [ CODE ] tags in the first post. That's rare.

    Your code is rather ... confusing. When you open the JavaScript console of your browser, you'll see the concrete error messages.

    Your ShowTotal() and ShowProTotal() function expect an object as the argument, but you don't pass anything when calling them. You use the return values of the function, but they don't have any return value. And what is the eval() supposed to do?? Don't use eval() unless you really, truly know what you're doing.

    I think it might be a good idea to start from scratch. Before you start writing down code, make of concept of what you wanna do and how you wanna implement it. While you program, test each functionality before moving on to the next one. This way you'll notice errors very early and don't end up with a whole script of broken code.

    By the way, is there any reason why you distinguish between ShowTotal() and ShowProTotal()? In the code you posted, it's completely useless, because you add up the values, anyway.

    Personally, I'd approach this in a different way: Make a single function for calculating the total and bind it to the "onchange" event of the input fields. In the function, loop through all fields and add up the values (you only need to account for checked boxes). After that, display the total.
    The 6 worst sins of security ē How to (properly) access a MySQL database with PHP

    Why canít I use certain words like "drop" as part of my Security Question answers?
    There are certain words used by hackers to try to gain access to systems and manipulate data; therefore, the following words are restricted: "select," "delete," "update," "insert," "drop" and "null".

IMN logo majestic logo threadwatch logo seochat tools logo