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

    Multiplying 3 separate radiobutton values; Help?

    When an option in each section of the form is selected, the values of each selection need to be multiplied together when the 'calculate' button is clicked; however, after many attempts my conclusion is I clearly have no idea what I am doing. It would be amazing if I could get some help though?


    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=utf-8">
    <title>gotham airlines</title>
    <script>

    function calculateCost() {
    var radioButton;
    var cost = 0;

    for (var i = 1; i <= 6; i++) {
    radiobutton = document.getElementById("flight" + i);
    if (radiobutton.checked == true) {
    cost += parseInt(radiobutton.value);
    }
    }

    alert("The selected flight will cost $" + cost);
    }

    </script>
    </head>
    <body>
    <h1>Gotham Airlines Fare Calculator</h1>
    <form>
    <p>Complete the form below to calculate the cost of your flight.</p>
    <p><input type="radio" id="flight1" name="flights"
    value="230"> <label for="flight1">Gotham - Hill Valley</label><br>
    <input type="radio" id="flight2" name="flights"
    value="250"> <label for="flight2">Gotham - Las Venturas</label><br>
    <input type="radio" id="flight3" name="flights"
    value="190"> <label for="flight3">Gotham - Storybrooke</label><br>
    <input type="radio" id="flight4" name="flights"
    value="160"> <label for="flight4">Gotham - Marlinshire</label><br>
    <input type="radio" id="flight5" name="flights"
    value="270"> <label for="flight5">Gotham - Lillian</label><br>
    <input type="radio" id="flight6" name="flights"
    value="220"> <label for="flight6">Gotham - Seahaven</label></p>

    <p><input type="checkbox" id="returnfare" name="return fare"
    value="2"> <label for="returnfare">Click here if you will be purchasing a return fare</label></p>

    <p><input type="radio" id="seating1" name="seating"
    value="2"> <label for="seating1">First class</label><br>
    <input type="radio" id="seating2" name="seating"
    value="1.5"> <label for="seating2">Business class</label><br>
    <input type="radio" id="seating3" name="seating"
    value="0"> <label for="seating3">Economy class</label></p>
    <p><input type="submit" value="Calculate"
    onClick="calculateCost();"> <input type="reset"></p>
    </form>
    </body>
    </html>

  • #2
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    If you have more than one radio button with the same name, they become an array-like object, so you can't just get the value of "flights". You have to loop through the array, get the value of the one that is checked, and then calculate.
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #3
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,984
    Thanks
    56
    Thanked 557 Times in 554 Posts
    you have 3 separate sections - flights, return ticket and seat class. But you only ever loop though the flights. You need to collect values for of all of them, multiply them at the end and then display the result. If you are going to submit this as homework you should study it to see how it works...

    Code:
    function calculateCost() { 
    
    for (var i = 1; i < 7; i++) { 
    var radiobutton = document.getElementById("flight" + i); 
    if (radiobutton.checked == true) { 
    var base=radiobutton.value;
    		}
    	}
    var rtn=document.getElementById("returnfare").checked?2:1; 
    for (var a = 1; a < 4; a++) { 
    var radiobutton = document.getElementById("seating" + a); 
    if (radiobutton.checked == true) { 
    var seatclass=radiobutton.value;
    		}
    	}
    var cost=base*rtn*seatclass;
    alert("The selected flight will cost $" + cost); 
    }

  • Users who have thanked xelawho for this post:

    Lana1993 (09-26-2012)

  • #4
    New to the CF scene
    Join Date
    Sep 2012
    Posts
    4
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Thankyou

    Thank you so much, I would hug you. I agree I do need to study, this was actually a minor university assessment. I thought it would be easy, it isn't. It is beyond me, but I have a new found respect for who can actually do this. Again, thank you!!!


  •  

    Posting Permissions

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