Show correct price based on quantity picked from select menu

Question

I have these two fields inside form:

<form method="post" action="./completed-order.php">

<input value="0.025" name="price" type="hidden" />

<select name="quantity" id="selectQuantity" tabindex="1" class="span2">
<option value="3000">3000</option>
<option value="4000">4000</option>
<option value="5000">5000</option>
<option value="6000">6000</option>
<option value="7000">7000</option>
<option value="8000">8000</option>
<option value="9000">9000</option>
<option value="10000">10000</option>
<option value="11000">11000</option>
........
</select>

<input value="" name="final-price" type="text" />

</form>

what I want to that when user select any givven values from select menu, to multiply that value with price value from name="price" field and show it inside name="final-price" field. I need this to be done using jQuery.

Thanks for help.

Answer 1

Something along the lines of this would work:

var quantity = $('#selectQuantity').find(":selected").val();
var price = $('input[name="price"]').val();

$('input[name="final-price"').val(quantity * price);

To get this to update every time you need to hook the selectQuantiy list changing using change()

$('#selectQuantity').change(function() {
    var quantity = $(this).find(":selected").val();
    var price = $('input[name="price"]').val();

    $('input[name="final-price"').val(quantity * price);
});

Answer 2

Try,

var xFinalPrice = $('input[name="final-price"]');
var xQty = $('input[name="quantity"]');
var xPrice = $('input[name="price"]');

xFinalPrice.val(parseInt(xQty.val()) * parseInt(xPrice.val()));