Home/ Questions/Q 933509
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-15T20:50:45+00:00

I’m trying to create a page where there are two dropdown menus, and then

  • 0

I’m trying to create a page where there are two dropdown menus, and then when the user presses submit, it calculates a price based on the data given from the dropdown menu. It needs to take either 1 or 2 from the first dropdown menu choice, multiply that by the value of the second dropdown menu choice, multiply that by 0.2, and output it when the user presses submit. I’ve tried to make it work but I keep getting NaN errors. Any help? 

<head>
<script type="text/javascript">
function price() {
        var sqBn = document.priceCalc.squareOrBanner;
        var Amt = document.priceCalc.number;
    var price = sqBn * Amt * 0.2;
    document.write(price);
}
</script>

<form name="priceCalc" action="priceCalcPage.html" onsubmit="document.write(price())">
<div align="center">
<select name="squareOrBanner">
<option value="1">Square</option>
<option value="2">Banner</option>
</select>

<select name="number">
<option value="250">250</option>
<option value="500">500</option>
<option value="750">750</option>
<option value="1000">1000</option>
</select>
<br><input type="submit" value="Figure out pricing!"><br>
</div>
</form>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Maybe you are looking for something like this:

    http://jsfiddle.net/JSvSn/1/

    You need to access the value property in those objects:

    var price = sqBn.value * Amt.value * 0.2;

    EDIT: Here’s a version that updates the value of an input box with the price: http://jsfiddle.net/JSvSn/5/

    EDIT 2: Show price in a div.

    • 0