Tengo una situación en la que necesito calcular la suma tomando los valores de TD id="cantidad" que se repetirá/duplicará varias veces. Ajax solo toma valor del 1er TD y el resto se ignora.
// ajax part function CalculateMonthlySalary() { var tot = 0; $("#amount").each(function() { tot += parseInt($(this).text()); $("#divEstimatedMonthlySalary").html(addCommas(tot.toFixed(0))) }); } <tr data-row-id="1" class="sum"> <td class="editable-col" contenteditable="true" col-index='1' oldVal="Basic Salary">Basic Salary</td> <td id="amount" onkeyup="CalculateMonthlySalary();" class="editable-col" contenteditable="true" col-index='2' oldVal="2000.00">2000.00</td> </tr> <tr data-row-id="2" class="sum"> <td class="editable-col" contenteditable="true" col-index='1' oldVal="Housing Allowance">Housing Allowance</td> <td id="amount" onkeyup="CalculateMonthlySalary();" class="editable-col" contenteditable="true" col-index='2' oldVal="2000.00">2000.00</td> </tr> <tr data-row-id="3" class="sum"> <td class="editable-col" contenteditable="true" col-index='1' oldVal="Transport Allowance">Transport Allowance</td> <td id="amount" onkeyup="CalculateMonthlySalary();" class="editable-col" contenteditable="true" col-index='2' oldVal="1000.00">1000.00</td> </tr> <div class="Heading2">Total Monthly Salary</div> <div style="clear:both;"></div> <br> <div style="margin-left:20px;" id="divEstimatedMonthlySalary" class="Web1">0</div>¿Alguna idea de dónde estoy haciendo mal?
Simplemente agregue la amount de atributo personalizado en su etiqueta td .
<!-- Like this --> <td amount ....>xxx</td> // cambia el selector en función con la amount de atributo personalizado
function CalculateMonthlySalary(){ var tot=0; //"#amount" to "td[amount]" $("td[amount]").each(function() { tot += parseInt($(this).text()); $("#divEstimatedMonthlySalary").html(addCommas(tot.toFixed(0))) }); }Está haciendo esto porque está usando ID y no clases. Los ID solo se deben usar para un elemento. Cámbielo a una clase y luego recorra cada uno para que funcione.
id debe ser único en un documento web. Javascript también asume esto y, por lo tanto, ignora todos los elementos después de encontrar un elemento que coincida con la identificación.
debe usar el nombre de la clase para seleccionar el td en su lugar.