jquery autocalculate form inputs

Question

I have three form inputs for people to input certain tax rates(tax_one, tax_two, sales_tax) and then i have a row of inputs for an item for purchase. This row has price, tax_one, tax_two, and sales_tax.

I'm trying to figure out how to go about populating the tax fields for the item based on what the user inputs for their tax rates and the price of the item. One tricky thing is there could be several item rows on the page at once so i am using "[]" after the form input names to get an array when they submit.

heres a jsfiddle of the html so you can get an idea of what i'm trying to explain. http://jsfiddle.net/SU5jU/3/

Ideally, when a user changes that default "100.00" in the price[] field the three tax fields after it would auto-populate to their respective amounts based on the above form tax fields. I don't know if this is possible since i'm using the "[]" on the form names.

Answer 1

Here is an updated version of your jsfiddle: http://jsfiddle.net/SU5jU/6/

I added ID's to the form inputs, if you want to add more rows of totals just increase the integer in the ID's for that row by one (I added another row of totals to the updated jsfiddle so you can see this).

Answer 2

Is this the actual HTML that you are using on the page?

If it is, and you cannot change it at all (Ie - adding classes, wrapping the form sections in divs...) then you are going to have a problem as those [] are not friendly to the jQuery attribute selector.