i create a page which two textbox automatically multiply show result in another textbox. But it not working.
Javascript for multiplication......
<script type="text/javascript">
$(document).ready(function() {
$('#dataTable').on('keyup', '.price', calTotal)
.on('keyup', '.quantity', calTotal);
// find the value and calculate it
function calTotal() {
var $row = $(this).closest('tr'),
price = $row.find('.price').val(),
quantity = $row.find('.quantity').val(),
total = price * quantity;
// change the value in total
$row.find('.txt').val(total)
}
});
</script>
the html and php code is...
<table border="1" id="dataTable">
<tr>
<th> Id</th>
<th>p</th>
<th>B</th>
<th>M</th>
<th>D</th>
<th>De</th>
<th>Q</th>
<th>T</th>
</tr>
<?php
echo"<p></p>";
echo"<p></p>";
echo"<p></p>";
echo"<p><h3> Details</h3></p>";
$order = "SELECT * FROM abd ";
$result = mysql_query($order);
while($row = mysql_fetch_array($result))
{
$p= $row['p'];
$b=$row['b'];
$m= $row['m'];
$dp=$row['price'];
$q=$row['quantity'];
echo "<td><input type=text value=$id name=item[] readonly=readonly /></td>";
echo "<td><input type=text id=p name=p[] value=$p ></td>";
echo "<td><input type=text id=B name=b[] value=$b ></td>";
echo "<td><input type=text id=M name=m[] value=$m ></td>";
echo "<td><input type=text id=Q name=qua[] value=$qua ></td>";
echo "<td><input type=text id=price name=price[] value=$price class=price ></td>";
echo "<td><input type=text id=Quantity name=q value=$q class=quantity ></td>";
echo "<td><input type=text id=txt name=txt class=txt > </td>";
?>
</table>
when i enter dprice and quantity it automatically show the value in total price. But It not working.Please Help
Try
total = parseInt(price) * parseInt(quantity);
This will convert your val() strings to integers to make possible math operations. If have floats use parseFloat() instead parseInt();
First you have to convert the value or input to number
using parseInt()
or using parseFloat()
method. Something like this would work
function calTotal() {
var $row = $(this).closest('tr'),
price = $row.find('.price').val();
quantity = $row.find('.quantity').val();
total =parseInt(price) * parseInt(quantity);
//total= parseFloat(price) * parseFloat(quantity); this can be used also
console.log("Total is " + total);
}
first convert values to the specific type and then do multiplication. function calTotal() { var $row = $(this).closest('tr'), price = parseFloat($row.find('.price').val()); quantity = parseInt($row.find('.quantity').val()); total =price * quantity; console.log("Total is " + total); }