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 2 of 2

Thread: Need some help

  1. #1
    New to the CF scene
    Join Date
    Aug 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Need some help

    I'm about three weeks into a programming course. The script below is supposed to display the total $ when the submit button is clicked. Instead of running the javascript, it displays it at the bottom of the browser page in text. It's done it on two versions of ie and on firefox. My instructor hasn't been any help. What am I missing?

    <?xml version = "1.0" encoding = "utf-8" ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd>

    <!-- e54.html
    A solution to Exercise 5.4
    -->

    <html xmlns = "http://www.w3.org/1999/xhtml">
    <head>
    <title> Exercise 5.4 </title>
    <script type = "text/javascript" src = "e54.js" >
    </script>
    </head>
    <body>
    <h3> Order Form </h3>
    <form name = "orderForm" onSubmit = "finish()">
    <p>
    <label> <input type = "text" name = "apples"
    size = "3"
    onChange = "appleHandler()" />
    Apples
    </label>
    </p><p>
    <label> <input type = "text" name = "oranges"
    size = "3"
    onChange = "orangeHandler()" />
    Oranges
    </label>
    </p><p>
    <label> <input type = "text" name = "bananas"
    size = "3"
    onChange = "bananaHandler()" />
    Bananas
    </label>
    </p><p>
    <input type = "reset" name = "Clear Order Form" />
    <input type = "submit" name = "Submit Order" />
    </p>
    </form>
    </body>
    </html>

    // e54.js - The JavaScript file for the solution
    // to Exercise 5.4

    var total = 0

    // The event handler functions for the text boxes

    function appleHandler() {
    var number = document.orderForm.apples.value;
    total = total + number * 0.59;
    }

    function orangeHandler() {
    var number = document.orderForm.oranges.value;
    total = total + number * 0.49;
    }


    function bananaHandler() {
    var number = document.orderForm.bananas.value;
    total = total + number * 0.39;
    }

    // The event handler function to produce the total cost message
    // when "submit" is clicked

    function finish() {
    total = total * 1.05;
    alert("Thank you for your order \n" +
    "Your total cost is: $" + total + "\n");
    }

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,982
    Thanks
    203
    Thanked 2,536 Times in 2,514 Posts
    I am not sure what you mean by "displays it in text".

    The result is shown in an alert and as far as I can see th calculations are accurate. But you need to modify the final line to
    "Your total cost is: $" + total.toFixed(2) + "\n");

    If you are using the script within the page rather than as an external file, naturally it must be enclosed in
    <script><\script> tags.

    BTW, when posting here please help us to help you by following the posting guidelines and wrapping your code in CODE tags. This means use the octothorpe or # button on the toolbar. You can (and should) edit your previous post.


    Quizmaster: The historic Stormont Castle is in the eastern part of which city?
    Contestant: Bristol
    Last edited by Philip M; 08-24-2011 at 05:37 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.


  •  

    Posting Permissions

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