below in my text field
but displaying NaN in text field
<div class="col-md-4">
<div class="form-group">
Untit Price :
<input type="text" style="text-align:right;" readonly="readonly" id="txtUnitPrice" value="0.00" name="UnitPrice" class="form-control" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
Qunantity :
<input type="text" id="txtQuantity" style="text-align:right;" value="0.00" name="Quantity" class="form-control" />
</div>
</div>
<div class="col-md-4">
<div class="form-group">
Discount :
<input type="text" id="txtDiscount" style="text-align:right;" value="0.00" name="Discount" class="form-control" />
</div>
</div>
using JS for calculation
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<link rel="shortcut icon" href="#">
<script type="text/javascript">
$(document).ready(function () {
$("#select2-3").val(0);
$("#select2-3").change(function () {
var itemId = $("#select2-3").val();
GetItemUnitPrice(itemId);
});
$("input[type=text]").change(function() {
CalculateSubTotal();
});
});
function CalculateSubTotal() {
var UnitPrice = $("txtUnitPrice").val();
var Quantity = $("txtQuantity").val();
var Discount = $("txtDiscount").val();
var Total = (UnitPrice * Quantity) - Discount;
$('#txtTotal').val(parseFloat(Total).toFixed(5));
}
function GetItemUnitPrice(itemId) {
$.ajax({
async: true,
type: 'GET',
dataType: 'JSON',
contentType: 'application/json; charset=utf-8',
url: '/Home/getItemUnitPrice', data: { itemId: itemId },
success: function (data) {
$("#txtUnitPrice").val(parseFloat(data).toFixed(2));
},
error: function () {
alert("There is some problem to get the Unit Price.");
}
});
}
</script>