在第10行之后,Datatables.Net行cilck事件无法正常工作

时间:2016-07-07 07:23:42

标签: jquery datatables

我正在尝试打开一个模式,以便根据表格行的点击用作编辑屏幕。但是,这仅适用于表的前10行。

用于获取行数据的代码是

LoginStatus

正在构建这样的表,但是有538行

$(document).ready(function () {
  $("tr").click(function () {
    //alert($(this.id).selector);
    $("#updateCase").modal();
  });
});

我正在使用<table id='tblProcessing' class='table table-striped table-hover table-border'> <thead> <tr> <th class='centre RequestId' hidden>RequestId</th> <th class='centre CMCReference'>CMC Reference</th> <th class='centre FirstCustomerName'>First Customer Name</th> <th class='centre FirstCustomerDOB'>First Customer DOB</th> <th class='centre SecondCustomerName'>Second Customer Name</th> <th class='centre SecondCustomerDOB'>Second Customer DOB</th> <th class='centre CustomerPostcode'>Customer Postcode</th> <th class='centre BusinessArea'>Business Area</th> <th class='centre AccountType'>Account Type</th> <th class='centre AccountOrCardNumber'>Account Or Card Number</th> <th class='centre LOAOutcome'>LOA Outcome</th> <th class='centre Outcome'>Outcome</th> <th class='centre Response'>Response</th> <th class='centre Complete'>Complete</th> <th class='centre Edit'>Edit</th> </tr> </thead> <tfoot class='foot'> <tr> <th>RequestId</th> <th>CMC Reference</th> <th>First Customer Name</th> <th>First Customer DOB</th> <th>Second Customer Name</th> <th>Second Customer DOB</th> <th>Customer Postcode</th> <th>Business Area</th> <th>Account Type</th> <th>Account Or Card Number</th> <th>LOA Outcome</th> <th>Outcome</th> <th>Response</th> <th>Complete</th> <th>Edit</th> </tr> </tfoot> <tbody> <tr id='2211'> <td class='centre RequestId' hidden>xxxx</td> <td class='centre CMCReference'>xxxxx</td> <td class='centre FirstCustomerName'>Susan Seymour</td> <td class='centre FirstCustomerDOB'>08/10/1981 </td> <td class='centre SecondCustomerName'></td> <td class='centre SecondCustomerDOB'></td> <td class='centre CustomerPostcode'>PE4 XXX</td> <td class='centre BusinessArea'></td> <td class='centre AccountType'>Mortgage</td> <td class='centre AccountOrCardNumber'>xxxxxxxx</td> <td class='centre LOAOutcome'>Not Seen</td> <td class='centre Outcome'></td> <td class='centre Response'></td> <td class='centre Complete'>True</td> <td class='centre Edit'><span class='btn><i id='xxxx' class='fa fa-pencil-square-o fa-2x edit' aria-hidden='true'></i></span></td> </tr> </tbody>

来调用它

让我感到困惑的是,前10行是可点击的,但之后没有任何内容。

任何和所有帮助表示赞赏。

由于

西蒙

1 个答案:

答案 0 :(得分:1)

问题是因为下一页是由DataTable插件动态创建的,所以你需要使用委托的事件处理程序:

$('#tblProcessing').on('click', 'tr', function () {
    //alert($(this.id).selector);
    $("#updateCase").modal();
});