使用JQuery将sum放在Parent td中

Question

I have following table and I want to put sum of child table input into parent td input

<table cellspacing="0" rules="all" border="1" id="gvSPActivities" style="border-collapse: collapse;">
    <tr>
        <th scope="col">
            TextVal1
        </th>
        <th scope="col">
            TextVal2
        </th>
        <th scope="col">
            TextVal3
        </th>
    </tr>
    <tr class="gridrow2">
        <td>
            <input name="gvSPActivities$ctl02$TextVal1" type="text" id="gvSPActivities_TextVal1_0"
                class="numeric" style="width: 150px;" />
        </td>
        <td>
            <input name="gvSPActivities$ctl02$TextVal2" type="text" id="gvSPActivities_TextVal2_0"
                class="numeric" style="width: 150px;" />
        </td>
        <td>
            <input name="gvSPActivities$ctl02$TextVal3" type="text" id="gvSPActivities_TextVal3_0"
                class="total" style="width: 150px;" />

        <table>

       <tr>
           <td>
                        <input name="gvSPActivities$ctl02$gvBenefic$ctl02$txtMaleBenefic" type="text" id="gvSPActivities_gvBenefic_0_txtMaleBenefic_0" class="numeric" style="width:100px;" />
                        </td><td>
                        <input name="gvSPActivities$ctl02$gvBenefic$ctl02$txtFemaleBenefic" type="text" id="gvSPActivities_gvBenefic_0_txtFemaleBenefic_0" class="numeric" style="width:100px;" />
                        </td>

                </tr>


</table>
            </td>
    </tr>

</table>

Thanks.

Answer 1

Your code is terribly obfuscated but I think this is what you are looking for:

$(".gridrow2 td input").onkeyup(function() {
    var sum = 0;

    $(".gridrow2 :input").each(function() {
        sum += $(this).val();
    });

    $("#gvSPActivities_gvBenefic_0_txtMaleBenefic_0").val(sum);
});

It changes the value of the "parent <td> input" to the sum of the three children inputs. I think.

Answer 2

var result = 0;

$('table > td.gridrow2 > table > td').each(function() {
  result += parseInt($(this).find('input.numeric').val());
});

$('td.gridrow2 > td:eq(2) > input[name="gvSPActivities$ctl02$TextVal3"]').val(result);

Answer 3

I don't know when do you want to update the total but you can use this code.

$('.gridrow2').each(function(){
    var total = 0;
    $(this).find('table > .numeric').each(function(){
        total += this.value;
    });

    $(this).find('.total').val(total);
});