www.webdeveloper.com
Results 1 to 2 of 2

Thread: help please to write the script

Hybrid View

  1. #1
    Join Date
    Oct 2012
    Posts
    3

    help please to write the script

    Hi guys!
    Please help me write correct code below.

    I wrote it but but something goes wrong and I'm already lost!

    It is part of an online payment form. Depending on your choice, the price must be displayed immediately. If the user changes selection - price will change too. Not buttons. Only events.


    I used only one tool to recover data value. I used innerHTML to place data into a span tag.

    But I displays NaN, although I used parseInt ...


    Can anyone explain where I'm wrong?

    Thanks!

    (I isolated select3 because the function does not work )
    <!-- -->




    <html>
    <head>
    <title>Buyer form </title>
    <script langage="javascript" type="text/javascript">
    function caclulatePrice()

    {

    var select1, select2, select3, select4, select5, totalPrice;
    totalPrice = 0;

    //select 1

    select1 = parseInt(document.getElementById("firstProduct").value);
    //alert(select1);

    //select2
    select2 = parseInt(document.getElementById("secondProduct").value);
    //alert(select2);


    /*
    //select3
    select3 = parseInt(y);

    for (var i=0; i < document.formSell.thirdProduct.length; i++)
    {
    if (document.formSell.thirdProduct[i].checked)
    {
    var y = document.formSell.thirdProduct[i].value;
    }
    }


    */


    //select4
    if (document.formSell.fourthProduct.checked == 1)
    {
    select4 = parseInt(document.getElementById("4-thProduct").value)
    }


    //select5
    select5 = parseInt(document.getElementById("fifthProduct").value);
    //alert(select5);




    totalPrice = select1+select2+ select5 + select4;
    document.getElementById("finalPrice").innerHTML = totalPrice;



    return;
    }
    </script>
    <style type="text/css">
    body
    {
    background-color:grey;
    }

    #mainContent
    {
    background-color:#F2EDE4;
    width: 80%;
    margin: auto;
    padding:10px;
    }

    #price
    {
    background-color:red;
    color:white;
    width: 860px;
    margin: auto;
    padding: 5px 20px 5px 20px;
    /*text-decoration:blink;*/
    font-size:14px;
    font-weight:bold;
    height: 50px;
    }
    </style>

    </head>
    <body>
    <div id="mainContent">
    <h2>Buyer </h2>


    <form name="formSell">


    <!-- select1 -->
    <h4>First product:</h4> <br />
    <select id="firstProduct" onchange="caclulatePrice()">
    <option value="0">Choose!</option>
    <option value="100">100$</option>
    <option value="200">200$</option>
    <option value="300">300$</option>
    </select>
    <br />

    <!-- select2 -->
    <h4>Second product:</h4> <br />
    <select id="secondProduct" onchange="caclulatePrice()">
    <option value="0">Choose!</option>
    <option value="100">100$</option>
    <option value="200">200$</option>
    <option value="300">300$</option>
    </select>
    <br />



    <!-- select3 -->
    <h4>Third product</h4>
    <br />
    <input type="radio" name="thirdProduct" value="100" onblur="caclulatePrice()">3-th product for 100$<br>
    <input type="radio" name="thirdProduct" value="200" onblur="caclulatePrice()">3-th product for 200$<br>

    <!-- select4 -->
    <br />
    <h4>Fourth product, free, if total purchase exceed 800$ </h4>
    <input type="checkbox" name="fourthProduct" id="4-thProduct" value="800" onchange="caclulatePrice()">Fourth product 800$<br>


    <br />
    <!-- select5 -->
    <h4>The fifth element</h4>
    <select multiple="multiple" id="fifthProduct" onchange="caclulatePrice()" >
    <option value="0">Choose!</option>
    <option value="100">fifth element 1 - 100$</option>
    <option value="200">fifth element 2 - 200$</option>
    <option value="300">fifth element 3 - 300$</option>

    </select>

    </form>

    <div id="price">
    <p> Final price <span id="finalPrice" value=""></span> </p>
    </div>
    </div>
    </body>
    </html>

  2. #2
    Join Date
    Mar 2007
    Location
    U.K.
    Posts
    1,127
    There is a scenario in which one operand in the calculation can be undefined. All you have to to is find how you let that happen.
    Where used, return should be executed unconditionally and always as the last statement in the function.

    That's my signature, it's not part of the damn post!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles