How Get Table's Row And Column Value Using JQuery
Here we are finding table's rows columns values on clicking.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Find table row column values on click in jquery</title>
<script src="Script/jquery-1.9.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#tbl tbody tr').on('click', function
()
{
var id = $(this).children("td:eq(0)").text();
var name = $(this).children("td:eq(1)").text();
var city = $(this).children("td:eq(2)").text();
alert("ID: "+id+", Name: "+name+
",
City: "
+city);
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table id="tbl" border="1">
<tr><td>1</td><td>Amit</td><td>Dehri</td></tr>
<tr><td>2</td><td>Mishra</td><td>Buxar</td></tr>
<tr><td>3</td><td>Anand</td><td>Aurangabad</td></tr>
<tr><td>4</td><td>Sharma</td><td>Kuju</td></tr>
<tr><td>5</td><td>Ashutosh</td><td>Hagipur</td></tr>
</table>
</div>
</form>
</body>
</html>
View output :
If you click on table's any row of any column and want to find that value then use below codes.
<script type="text/javascript">
$(document).ready(function () {
$('#tbl tbody td').on('click', function
()
{
alert($(this).text());
});
});
View output :
