Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    May 2013
    Thanked 0 Times in 0 Posts

    How can I do a line break and a few other questions


    This is a webpage that uses java script and I was having some issues with it. The page calculates costs of USB depending on size and it displays your name, and this info displays in a window.

    I am doing this as a practice for class, but there are a few things I can't get to work. I am new to this.

    How can I get the price to go to two decimal places?

    How can I get a line break between the inserted name and the next line. For example, if your name was Peter and you clicked the calculate button, a window will open saying

    Hello PeterThe memory stick will cost: $10

    I want it to come up as

    Hello Peter
    The memory stick will cost: $10.00

    Anything I try seems to break the window and the window won't come up at all.

    I keep trying to get the price to display at 2 decimal places, but that also seems to break the window. So instead of $10, I want it to be $10.00.

    Here is the code, thanks for any help

    <?xml version="1.0"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

    <html xmlns="http://www.w3.org/1999/xhtml">
    <title>Activity 14 part 1</title>
    <script type="text/javascript">
    function usbcost(s)
    var name;
    var cost;
    var DispWin;
    DispWin = window.open("","NewWin", " width=400, height=200");
    message = "Hello " + document.frmusbcost.name.value;

    if(s <=8)
    cost = 10;
    DispWin.document.write("The memory stick will cost: $" +cost);
    cost = 20;
    DispWin.document.write("The memory stick will cost: $" +cost);
    <h1>USB cost calculation</h1>
    <p>Click on the button to calculate costs</p>
    <form name="frmusbcost">
    <p>Customer Name: <input type="text" size="10" name="name" /> </p>
    <p>USB storage size (G): <input type="text" size="10" name="size" /> </p>
    <p><input type="button" value="Calculate cost"
    onClick="usbcost(document.frmusbcost.size.value);" /> </p>

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Thanked 548 Times in 547 Posts
    Do not use document.write() after your page renders. It will wipe it out.
    Check the curlie brackets in your javascript function. Some are missing.
    var name; var cost; var DispWin; Are not doing anything. Set them equal to a value.

    Easiest way to do a line break in js message is with \n
    alert("Hello Peter\nThe memory stick will cost: $10.00");
    Last edited by sunfighter; 05-13-2013 at 02:58 PM.

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    London, England
    Thanked 2,508 Times in 2,486 Posts
    How can I get the price to go to two decimal places?

    Use .toFixed(2)

    A newline in HTML is <br>

    var message = "Hello " + document.frmusbcost.name.value + "<br>";
    message += "The memory stick will cost: $" + cost.toFixed(2);

    Assigning a name to a form is obsolete. Use an id instead.

    Prefer Number() to parseFloat(). Or Math.floor() if your values are integers.

    name = "name"
    You should avoid giving names or id's to your variables/functions/arguments/forms words which are HTML/JavaScript methods/properties/attributes such as 'name' or 'id' or 'value' or 'test' or 'text' or 'checked' or 'click' or 'href' or 'closed' or 'go' or 'submit' or 'replace' or 'button' or 'radio' or 'parseInt'.

    The <!-- and //--> comment (hiding) tags have not been necessary since IE3 (i.e. since September 1997). If you see these in some published script it is a warning that you are looking at ancient and perhaps unreliable code.
    Last edited by Philip M; 05-13-2013 at 04:07 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