Question

I am currently creating an order form. However, I have been stuck at the value obtaining. It is a product order form, I want to display price and calculate the amount by users’ choosing.

For example, I got a product quantity drop down list, so when the user chooses one product, the price div will display one value, if the user chooses 0, the price div will display $0. Where is the problem?

var productValue = document.getElementById("e_Product");
var productQuantity = document.getElementById("e_Quantity");
var stringValue = productValue.options[productValue.selectedIndex].text;

if (stringValue == "Product Name" && productQuantity == 1) 
{
    var singleValue = "$800.00";
    $('#e_Price').val(singleValue);
}
else
{
    var singleValue1 = "$0.00";
    $('#e_Price').val(singleValue1);
}

When I set two conditions in if statement, the whole function just does not work any more. Also, when I choose the product quantity from 1 to 0, the price field of the form is not updating the number, Do i miss something for the drop down list?

Answer 1

you should use an event handler for updating the field:

$("#e_Product").change(function(){
   var val = $(this).val();
   var quan = $("#e_Quantity").val();
   if (val == "Product Name" && quan == 1)
     var singleValue = "$800.00";
     $('#e_Price').text(singleValue); // if e_Price is a div tag you should use text() instead of val() 
   }
   else
   {
     var singleValue1 = "$0.00";
     $('#e_Price').text(singleValue1);
   }
})