Datatables.Net行のcilckイベントが行10の後に機能しない

Question

テーブル行のクリックに基づいて編集画面として使用するためにモーダルを開こうとしています。ただし、これはテーブルの最初の10行でのみ動作します。

行データを取得するために使用してコードイム

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

の表は、このように構築されたが538行

<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> 

と私が使用してそれを呼び出していますとされています$('#tblProcessing' ').DataTable();

最初の10行はクリック可能です。bその後は何もしません。

ありがとうございました。次のページが動的にDataTableのプラグインによって作成されるので、あなたが委任イベントハンドラを使用する必要があるので、問題は、ある

おかげ

サイモン

Answer 1

：

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