/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

-1 vote382 views1 answer
Jquery dom traversal parent
Javascript jQuery
1 vote309 views1 answer
Change src of iframe jquery
Javascript jQuery
0 vote333 views1 answer
How to remove modal-backdrop fade in jquery
Javascript jQuery
111 votes405 views6 answers
Foreach jquery
Javascript jQuery
35 votes309 views5 answers
Jquery checkbox set checked
Javascript jQuery
14 votes266 views6 answers
Jquery import js file
Javascript jQuery
3 votes342 views2 answers
Refresh ajax jquery
Javascript jQuery
0 vote316 views2 answers
Jquery selector id ends with
Javascript jQuery
0 vote297 views1 answer
Jquery each hover
Javascript jQuery
1 vote376 views1 answer
Jquery unselect option
Javascript jQuery