I need to get the value of userid, data-attribute from a html table and put this value into a var, but I wanna to this action without click action.
<table id="tblList">
<tbody id="someTest">
<tr data-userid="801992084067">
<tr data-userid="451207954179">
<tr data-userid="310896831399">
<tr data-userid="863939754980">
<tr data-userid="1123542226482">
</tbody>
</table>
I have tried to do this like that, but the rowId is undefined.
var rowId = $("#someTest tr").last().attr("[data-userid"]");
Simply, you can manage data attribute & value in HTML tag using data()
method of jQuery. Alternatively, you can use attr() method also,
var rowId = $("#someTest tr").last().data("userid");
Alternatively
var rowId = $("#someTest tr").last().attr("data-userid");
.data() method is used to store arbitrary data associated with the matched elements or return the value at the named data store for the first element in the set of matched elements.
Initial HTML
<button id="mybtn">MyButton</button>
Add data-attribute with value
$('button#mybtn').data('id',10);
Alternatively
$('button#mybtn').data('data-id',10);
Reproduced HTML
<button id="mybtn" data-id="10">MyButton</button>
Get value from data-attribute
alert($('button#mybtn').data('id')); //alerts 10
Alternatively
alert($('button#mybtn').attr('data-id')); //alerts 10
Change value of data-attribute
$('button#mybtn').data('id',15);
Alternatively
$('button#mybtn').attr('data-id',15);
Reproduced HTML
<button id="mybtn" data-id="15">MyButton</button>
Remove data-attribute
You can remove data attribute using removeData()
method
$('button#mybtn').removeData('id');
Alternatively
$('button#mybtn').removeAttr('data-id');
Reproduced HTML
<button id="mybtn">MyButton</button>
only Remove []
:
var rowId = $("#someTest tr").last().attr("data-userid");
Final code :
<html>
<title>This is test</title>
<head>
</head>
<body>
<table id="tblList">
<tbody id="someTest">
<tr data-userid="801992084067">
<tr data-userid="451207954179">
<tr data-userid="310896831399">
<tr data-userid="863939754980">
<tr data-userid="1123542226482">
</tbody>
</table>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
var rowId = $("#someTest tr").last().attr("data-userid");
alert(rowId);
})
</script>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With