我正在尝试熟悉jquery dataTables插件:http://www.datatables.net/manual/server-side#Sent-parameters
什么在起作用
我将json数据从服务器返回到我的客户端,并且正在填充表。
什么不起作用
当最终用户选择/点击行时,我需要能够捕获给定行中的数据。
这是我的代码:http://jsfiddle.net/e3nk137y/1515/
$("#users tr").click(function(){
alert($(this).find("pID").val());
});
上面的javascript是我一直在玩的东西。麻烦的是ajax调用是自动发生的,我不是在表中创建行的那个。最终,除了ID / pID之外,我还需要能够获取每一行中的一些字段
到目前为止我尝试了什么
除了使用javascript代码之外,我还在审核此问题:http://datatables.net/examples/api/select_single_row.html 但在该示例中,所有数据都是在客户端定义的,因此可以轻松为每个表行指定id或类
任何建议将不胜感激。
答案 0 :(得分:14)
希望这是你要找的东西
<强> HTML 强>
<table id="users" class="display" width="100%" cellspacing="0">
<thead>
<tr>
<th id="pID">ID</th>
<th>Name</th>
<th>Code</th>
<th>Available</th>
</tr>
</thead>
<tbody>
<tr>
<td>1-1</td>
<td>1-2</td>
<td>1-3</td>
<td>1-4</td>
</tr>
<tr>
<td>2-1</td>
<td>2-2</td>
<td>2-3</td>
<td>2-4</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>ID</th>
<th>Name</th>
<th>Code</th>
<th>Available</th>
</tr>
</tfoot>
</table>
<强>脚本强>
$(document).ready(function () {
var table = $('#users').DataTable();
$('#users tbody').on('click', 'tr', function () {
console.log(table.row(this).data());
});
});
答案 1 :(得分:2)
小提琴中的错误:
tr
方法中将on()
用作selector。find()
element by id,则需要使用#
。但请注意,如果有多个元素,则无法使用ID,请改用class。text()
代替val()
。更新功能:
$("#users").on('click', 'tr', function () {
alert($(this).find("#pID").text());
});