1

その列の親行に合計を設定する必要がある 1 つの列の子行に値を追加しようとしています。各子tdは、対応する親に値を追加する必要がありますtd

現在起こっていることは、最初の列の子行の値を合計し、親行の対応する入力フィールドに合計を設定できる間です。次に、2 番目の列の子行の値を合計すると、2 番目の列の親に値が設定されません。合計すると、最初の列の親になります。

コード[jsFiddle]は次のとおりです。

HTML:

<table class="table">
<tr class="parent-A">
        <td><h5>A</h5></td>
        <td>&nbsp;</td>
        <td><input type="text" /></td>
        <td>&nbsp;</td>
        <td><input type="text" /></td>
        <td>&nbsp;</td>
        <td><input type="text" /></td>
    </tr>
    <tr>
        <td><h6>A1</h6></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="A" /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="A"  /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="A"  /></td>
    </tr>
    <tr>
        <td><h6>A2</h6></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="A" /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="A"  /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="A"  /></td>
    </tr>
    <tr>
        <td><h6>A3</h6></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="A" /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="A"  /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="A" /></td>
    </tr>
    <tr class="parent-B">
        <td><h5>B</h5></td>
        <td>&nbsp;</td>
        <td><input type="text" /></td>
        <td>&nbsp;</td>
        <td><input type="text" /></td>
        <td>&nbsp;</td>
        <td><input type="text" /></td>
    </tr>
    <tr>
        <td><h6>B1</h6></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="B" /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="B"  /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="B"  /></td>
    </tr>
    <tr>
        <td><h6>B2</h6></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="B" /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="B"  /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="B"  /></td>
    </tr>
    <tr>
        <td><h6>B3</h6></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="B" /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="B"  /></td>
        <td>&nbsp;</td>
        <td><input type="text" data-parent="B" /></td>
    </tr>
</table>

jQuery:

$('input[type=text]').on('blur', function() {

    var $dataRows=$(".table");
    var parent_name = $(this).attr('data-parent');
    var find_parent_row = $('tr.parent-' + parent_name);
    var $this_row = $(this).closest('tr');

        $this_row.each(function() {
            $(this).find('input').each(function(i){        
                totals[i]+=parseInt( $(this).val());
                console.log(totals[i]);
                var eVal = (isNaN(totals[i])) ? 0 : totals[i];
                $(find_parent_row).find('input').eq(i).val(eVal);
            });

        });

    });



});
4

1 に答える 1

1

試す

fiddle Demo

$(function () {
    $('[class*="parent-"] input').attr('readonly', true);
    $('input[type=text]').on('blur', function () {
        var totals = [0, 0, 0];
        var $dataRows = $(".table");
        var parent_name = $(this).data('parent');
        var find_parent_row = $('tr.parent-' + parent_name);
        find_parent_row.nextUntil('[class*="parent-"]').find('input').each(function () {
            totals[$(this).parent('td').index() / 2 - 1] += +this.value;
        });
        find_parent_row.find('input').each(function(i) {
            this.value = totals[i];
        });
    });
});
于 2013-12-08T03:20:26.123 に答える