Question

I have an invoice. Line items are arranged in a table, basically like this:

| product name (drop down select menu) | price | quantity | line total |

I have this JavaScript file: http://pastie.org/3021944.

If I’m editing an invoice, when I change the product by selecting a different one from the drop down menu, it populates the price field, the line total and the grand total of the invoice. That file also adds new rows with form fields and deletes table rows.

Everything works fine, until I click on “Add a new line” to add a new product to the invoice. But then, only on those added rows, the price and grand total for that new line is not updated, it’s just blank.

Answer 1

You’ll need to attach your events with on() so that dynamically added content is wired up automatically

My firewall is blocking your link, but something like this:

$(document).on("blur", ".someSelector", function() {
   //your handler
});

if you’re using jQuery 1.7, or, if you’re on an older version of jQuery, you can use delegate

$(document).delegate(".someSelector", "blur", function() {
   //your handler
});

Do not use live, since it’s deprecated