getting data attributes from many items in a html table using jquery

Question

I have this snippet of code:

               <tr id="100" data-row-id="1">        
                                        <td align="center">611000</td>
                                        <td align="center">Regular</td>
                                        <td align="center"><input type="checkbox" name="idc_100" id="idc_100" value="true" data-rowid="1" /></td>   
                                        <td align="center"><input type="text" name="agencybudgetedamount" id="agencybudgeted_100" value="0" data-rowid="1"  disabled/></td>
                                        <td align="center"><input type="text" name="pibudgeted" id="pibudgeted_100" value="0" data-rowid="1"  disabled/></td>                                   
                                        <td align="center"><input type="text" name="PI Adjusted Budget" width="5" id="adjustedBudget_100" data-rowid="1" /></td>
                                        <td class="style1"><input type="text" name="Comments" id="comments_100" size="15" data-rowid="1"  /></td>
                                        <td><button type='button' class="addRegularFac">+</button></td>       
                               </tr>

I can use some slick jquery to get the various properties of each of the inputs I need like the id and the value:

    $('#myTableFac input').each(function (index, input) {
                  alert(input.id + " " + input.name + " " + input.value + " " + input.data("rowid")) ;
                });

(assuming the tr/tds are in a table id myTableFac)

This works well but I want to get those data attributes out as well and I cannot seem to get it using anything I found on stack overflow, leading me to believe the input is a different type of object I am getting. i.e. the .data("item") does not work, tells me function does not exist. So curious what I am doing wrong tried to use this link here:

Retrieving HTML data-attributes using jQuery

Not sure what I am screwing up.

Try using $(input).data("rowid")

JGV
– JGV

2016-03-17 23:03:08 +00:00
Commented Mar 17, 2016 at 23:03 — JGV
– JGV, Commented Mar 17, 2016 at 23:03

JGV · Accepted Answer · 2016-03-17 23:05:44Z

1

Try using $(input).data("rowid")

Fiddle: https://jsfiddle.net/99x50s2s/207/

$('#myTableFac input').each(function (index, input) {
              alert(input.id + " " + input.name + " " + input.value + " " + $(input).data("rowid")) ;
            });

answered Mar 17, 2016 at 23:05

JGV

5,2079 gold badges57 silver badges101 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

wawawoom · Accepted Answer · 2016-03-17 23:10:56Z

0

Try this :

$('#myTableFac input').each(function () {
    console.log($(this).data("rowid")) ;
});

Remove the parameters in your function, and use $(this) to point your input

answered Mar 17, 2016 at 23:10

wawawoom

1012 silver badges7 bronze badges

Collectives™ on Stack Overflow

getting data attributes from many items in a html table using jquery

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related