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
    Mar 2009
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Exclamation Need help with calculating values from radio buttons

    Ok I have an assignment (which I spent countless hrs trying to figure out) in which the person has to choose their department and their hourly wage is given for each department. In the text box they must put their hours worked for the week, which I can't seem to get to work this is what I have:

    <form id="employeeGroup">
    <table width="398" border="0" align="center" cellpadding="10">
    <tr>
    <td colspan="2" class="formheader">Employee Time Clock</td>
    </tr>
    <tr>
    <td width="172" class="formlabels">First Name</td>
    <td width="180"><label>
    <input name="first" type="text" id="first" size="20"/>
    </label></td>
    </tr>
    <tr>
    <td class="formlabels">Last Name</td>
    <td><label>
    <input name="last" type="text" id="last" size="20"/>
    </label></td>
    </tr>
    <tr>
    <td valign="top" class="formlabels">Department</td>
    <td><p>
    <label></label>
    <label>
    <input type="radio" name="department" onclick="salary()"id="financial" value="10.75" />
    </label>
    Financial<br />
    <input type="radio" name="department" onclick="salary()" id="humanresources" value="9.50" />
    Human Resources<br />
    <input type="radio" name="department" onclick="salary()" id="operations" value="8.75" />
    Operations<br />
    <input type="radio" name="department" onclick="salary()" id="it" value="12.50" />
    IT<br />
    </p>
    </td>
    </tr>
    <tr>
    <td class="formlabels">Hours Worked This week</td>
    <td><input name="hours" type="text" id="hours" size="10" /></td>
    </tr>
    <tr>
    <td class="formlabels">Gross Salary</td>
    <td><input name="totalgross" type="text" id="totalgross" readonly size="20" /></td>
    </tr>
    <tr>
    <td colspan="2" class="formlabels"><label>

    <div align="center">
    <input name="calcgross" type="button" id="calcgross" onclick="salary()" value="Calculate Salary"/>
    </div>
    </td>
    </tr>
    </table>
    <div align="center"></div>
    </form>

    The External Javascript:

    function salary(employeeGroup)
    {
    var hours = document.getElementById('hours').value;
    var totalgross = document.getElementbyId('totalgross').value;

    document.getElementById('financial').value=10.75 * hours;
    document.getElementById('humanresources').value=9.50 * hours;
    document.getElementById('operations').value=8.75 * hours;
    document.getElementById('it').value=12.50 * hours;

    alert( "You worked " + hours + "and your gross salary is" + totalgross);

    }

  • #2
    Regular Coder
    Join Date
    Mar 2009
    Location
    Portland Oregon
    Posts
    690
    Thanks
    44
    Thanked 63 Times in 62 Posts
    why are you calling salary() in the radio buttons? Don't you only want to call that when you calculate?

    you want the values to fill up, not call a function

  • #3
    Regular Coder
    Join Date
    Mar 2009
    Location
    Portland Oregon
    Posts
    690
    Thanks
    44
    Thanked 63 Times in 62 Posts
    it's all messed up. you are calling getElementById to get a value but you're telling it it's some new value.

    I think you need to say
    var hours=parseInt(document.getElementById('hours').value)

    you want to get the value of hours
    and then you want to have the buttons to add 1 to whichever one is clicked. they should start at 0 so when you multiply by each one, if that's how you're going to test for it, then only the one clicked with result in a product greater than 0.

  • Users who have thanked TinyScript for this post:

    double_a (03-15-2009)

  • #4
    New to the CF scene
    Join Date
    Mar 2009
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Can u give me an example? I still kind of lost on how to implement that, thanks

    Quote Originally Posted by TinyScript View Post
    it's all messed up. you are calling getElementById to get a value but you're telling it it's some new value.

    I think you need to say
    var hours=parseInt(document.getElementById('hours').value)

    you want to get the value of hours
    and then you want to have the buttons to add 1 to whichever one is clicked. they should start at 0 so when you multiply by each one, if that's how you're going to test for it, then only the one clicked with result in a product greater than 0.

  • #5
    Regular Coder
    Join Date
    Mar 2009
    Location
    Portland Oregon
    Posts
    690
    Thanks
    44
    Thanked 63 Times in 62 Posts
    what I would do is have four variables all equal to 0 for each of your options. have a function you call from the buttons onclick like you have, but in your function you need to add 1 to the button option corresponding variable that is clicked. then you can multiply all the of the options times the their variables and times the rate of pay for each one and add them all up. All of the values not clicked will equal 0 and the one that is clicked will equal the rate of pay for the option clicked.

    apply that to the hours and whamo! you're done. send it to the output div via innerHTML and you should be all set. You gotta learn it.


    Here's a tip I used to teach myself this stuff. ASK GOOGLE!

    be very specific with what you're looking for and try phrasing it several ways. You can find everything you need to learn online. I'm proof.


  •  

    Posting Permissions

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