Monday, 4 November 2013

Get selected table data using JQuery deligate method

=>Just Use jquery.js fiel,And use this code

=>Here no need to maintain tr id.

=>After double click on any row ,data will be display in text boxes.

<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function() {
$("#mytable").delegate("tr",'click',function() {
$(this).find("td").each(function(i){
var value=$(this).text();
$("#"+i).val(value);
});
});

});
</script>
</head>
<body>
<input type="text" id="0"/>
<input type="text" id="1"/></br></br>
<table id="mytable" border="2">
<tr>
<td>1000</td><td>2000</td>
</tr>
<tr>
<td>3000</td><td>4000</td>
</tr>
<tr>
<td>5000</td><td>6000</td>
</tr>
<tr>
<td>7000</td><td>8000</td>
</tr>
</table>
</body>
</html>


Get Selected table data using JQuery

=>Just use jquery.js file,And use this code

=>After double click on any row,Data will be display in text boxes.

<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function() {

$("#mytable tr").dblclick(function() {
var trid=$(this).attr("id");

$("#"+trid+" td").each(function(i) {
var value=$(this).text();
$("#"+i).val(value);
});
});
});
</script>
</head>
<body>
<input type="text" id="0"/>
<input type="text" id="1"/></br></br>
<table id="mytable" border="2">
<tr id="tr1">
<td>1000</td><td>2000</td>
</tr>
<tr id="tr2">
<td>3000</td><td>4000</td>
</tr>
<tr id="tr3">
<td>5000</td><td>6000</td>
</tr>
<tr id="tr4">
<td>7000</td><td>8000</td>
</tr>
</table>
</body>
</html>

Output: