CODEWITHSUNDEEP
jqueryhtmladdition
input
input

Reputation: 7519

Get data attribute value and set the value of the corresponding element

As a follow-up to this question and based on the answer given, I have done something like this: http://jsfiddle.net/9r79f/1/

HTML:

<table>
    <tr>
        <td></td>
        <td>Title</td>
        <td>Title1</td>
        <td>Title2</td>
    </tr>
    <tr>
        <td>A</td> 
        <td><input type="text" /></td>
        <td><input type="text" /></td>
        <td><input type="text" /></td>
    </tr>
    <tr>
        <td>A1</td>
        <td><input type="text" class="sub" data-parent="A"/></td>
        <td><input type="text" class="sub" data-parent="A" /></td>
        <td><input type="text" class="sub" data-parent="A" /></td>
    </tr>
    <tr>
        <td>A2</td> 
        <td><input type="text" class="sub" data-parent="A"/></td>
        <td><input type="text" class="sub" data-parent="A"/></td>
        <td><input type="text" class="sub" data-parent="A" /></td>
    </tr>
    <tr>
        <td>B</td> 
        <td><input type="text" /></td>
        <td><input type="text" /></td>
        <td><input type="text" /></td>
    </tr>
    <tr>
        <td>B1</td>
        <td><input type="text" class="sub" data-parent="B"/></td>
        <td><input type="text" class="sub" data-parent="B" /></td>
        <td><input type="text" class="sub" data-parent="B" /></td>
    </tr>
    <tr>
        <td>B2</td> 
        <td><input type="text" class="sub" data-parent="B"/></td>
        <td><input type="text" class="sub" data-parent="B"/></td>
        <td><input type="text" class="sub" data-parent="B" /></td>
    </tr>
</table>

jQuery:

$('input[type=text]').on('blur', function() {
        //alert($(this).val());
        calcA($(this));
});

function calcA(param){
        var finalresult = 0,
            $sub = param,
            $value = param.data('parent');

        $.each($sub, function(i) {
            var fiVal = parseFloat( $sub.eq(i).val() );

            if (fiVal) {
                finalresult += fiVal;
                $value.val( finalresult );
            }

        });
}

How do I set the value of the first row in A1 + A2 to the first row of input in A using data attributes without repeating the code? And do the same for B and so on?

Upvotes: 0

Views: 1371

Answers (1)

scrowler
scrowler

Reputation: 24405

You could do either of these things to get data-parent attribute:

var data_parent_value = $(param).attr('data-parent'); // A or undefined

See your console in this JSFiddle: http://jsfiddle.net/9r79f/2/

Upvotes: 1

Related Questions