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.

Answer 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")) ;
            });

Answer 2

Try this :

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

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