How can I find and print data-pk attribute name from onkey press method in javascript

Question

User-1355965324 posted

I want to get the  name  given for data-pk attribute for the current row  in KeyPress method . Here is my code The Data-pk name 'Holidayhrs' must be printed in javascript . 

<table>
<tr>
 <td><a href="#" data-pk="HolidayHrs">@Model.attendanceLogList[i].HolidayHrs</a><input asp-for="@Model.attendanceLogList[i].HolidayHrs" type="hidden" class="bros" /></td>
</tr>
</table>
<script>
$("td").keypress(function (e) {
            var tr = $(this).parents('tr');
            var datapk = $(this).parents('tr').attr('data-pk');
            
            var rownumber = tr.index();
            console.log(rownumber);
            console.log(datapk); // It is not working . The text 'HolidayHrs' must be printed
            
        });
</script>

Answer 1

User475983607 posted

I want to get the  name  given for data-pk attribute for the current row  in KeyPress method . Here is my code The Data-pk name 'Holidayhrs' must be printed in javascript . 

<table>
<tr>
 <td><a href="#" data-pk="HolidayHrs">@Model.attendanceLogList[i].HolidayHrs</a><input asp-for="@Model.attendanceLogList[i].HolidayHrs" type="hidden" class="bros" /></td>
</tr>
</table>
<script>
$("td").keypress(function (e) {
            var tr = $(this).parents('tr');
            var datapk = $(this).parents('tr').attr('data-pk');
            
            var rownumber = tr.index();
            console.log(rownumber);
            console.log(datapk); // It is not working . The text 'HolidayHrs' must be printed
            
        });
</script>

The HTML you shared does not have a data-pk attribute in the table row <tr>.  The data-pk attribute is in an anchor tag which is in a <rd>.  Secondly, there are no user input fields to detect the key press event.  

Keep in mind, this is the third post where text input are required but your design only contains checkboxes and hidden inputs.  The keypress event only works element that get focus like inputs.  However, any parent element can subscribe to the event. 

I'm guessing you are working with a library or code you have not told us about.   

Is there any way you can provide accurate code and requirements?  

Answer 2

User-1151440187 posted

You can do like this:

$("td").click(function (e) {
            var tr = $(this).parents('tr');
            var datapk = $(this).find('a').attr('data-pk');
            var rownumber = tr.index();
            console.log(rownumber);
            console.log(datapk); // It is not working . The text 'HolidayHrs' must be printed            
        });

Hope you get it.

Answer 3

User-1355965324 posted

Many Thanks