Auto calculation using javascript

Question

<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script>
            var form = document.forms.myform,
                    qty = form.qty,
                    cost = form.cost,
                    output = form.textbox;

            window.calculate = function () {
                var q = parseInt(qty.value, 10) || 0,
                        c = parseFloat(cost.value) || 0;
                output.value = (q * c).toFixed(2);
            };
        </script>

    </head>
    <body>
        <form action="caltest.php" method="post" name="myform" onkeyup="calculate()">
            <label>Num of PAX :</label>
            <input type="text" name="qty" />
            <input type="hidden" name="cost" value="700" />
            <br/>
            <lable>Total Price: </lable>
            <input type="text" name="textbox" />

        </form>
    </body>
</html>

I am doing a simple calculation.Not getting any output.

i have tried place in jsfiddle, it work fine... but when i insert this into my netbeans, it dose not give me any output — user3230289
– user3230289, Commented Jan 6, 2016 at 5:48

VolkerK · Accepted Answer · 2016-01-06 05:47:43Z

1

When var form = document.forms.myform is executed, there is no <form name="myform" ...yet.
The simplest (though maybe not the most sophisticated) solution is to move the <script> block from <head> to after the form code.

answered Jan 6, 2016 at 5:47

VolkerK

96.3k20 gold badges169 silver badges232 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ashok Chitroda · Accepted Answer · 2016-01-06 05:59:22Z

Try this one is working

<html>
    <head>
        <meta charset="UTF-8">
        <title></title>

    </head>
    <body>
        <form action="caltest.php" method="post" name="myform" onkeyup="calculate()" >
            <label>Num of PAX :</label>
            <input type="text" name="qty" />
            <input type="hidden" name="cost" value="700" />
            <br/>
            <lable>Total Price: </lable>
            <input type="text" name="textbox" />
      </form>    
      <script>
            var form = document.forms.myform,
                    qty = form.qty,
                    cost = form.cost,
                    output = form.textbox;

            window.calculate = function () {
                var q = parseInt(qty.value, 10) || 0,
                        c = parseFloat(cost.value) || 0;
                output.value = (q * c).toFixed(2);
            };
        </script>
    </body>
</html>

Collectives™ on Stack Overflow

Auto calculation using javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related