/Javascript/jQuery/How to calculate each row with on change table <td><input> jquery

How to calculate each row with on change table <td><input> jquery

How to calculate each row with on change table jquery

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
  <meta charset="utf-8">
  <title>Example</title>
</head>
<body>
  <table>
    <thead>
      <tr>
        <th>Quantity</th>
        <th>Price</th>
        <th>Total</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td><input type="text" class="qty"></td>
        <td><input type="text" class="price"></td>
        <td><input type="text" class="total" disabled></td>
      </tr>
      <!-- ...and so on... -->
    </tbody>
  </table>
<script>
  (function() {
    "use strict";

    $("table").on("change", "input", function() {
      var row = $(this).closest("tr");
      var qty = parseFloat(row.find(".qty").val());
      var price = parseFloat(row.find(".price").val());
      var total = qty * price;
      row.find(".total").val(isNaN(total) ? "" : total);
    });
  })();
</script>
</body>
</html>

Source: stackoverflow.com

Similar codes

0 vote166 views1 answer
JQuery onclick not firing on dynamically inserted HTML elements
Javascript jQuery
11 votes190 views3 answers
Jquery set width
Javascript jQuery
20 votes143 views6 answers
Jquery change image src
Javascript jQuery
1 vote152 views3 answers
Jquery onclick open url
Javascript jQuery
0 vote148 views1 answer
Jquery to json diff
Javascript jQuery
0 vote148 views2 answers
Jquery parse html
Javascript jQuery
2 votes155 views2 answers
Make ajax request post jquery
Javascript jQuery
2 votes162 views3 answers
Count all elements with class jquery
Javascript jQuery
14 votes169 views3 answers
Jquery toggle class
Javascript jQuery
21 votes152 views3 answers
Jquery scroll to position
Javascript jQuery