CODEWITHSUNDEEP
jquerydatatabletwitter-bootstrap-3
Sherin
Sherin

Reputation: 431

row click event not fired after pagination in bootstrap datatable

i am using bootstrap datatable for pagination.I also added click event to each row.But the click event fired only in the first page. It does not work after sorting or pagination.Here is my php code to display data

        <table id='tblCustomers' class='table table-bordered table-striped'>
                                 <thead>
                                  <tr>
                                              <th>Customer id</th>
                                               <th>Company</th>
                                              <th>First name</th>
                                              <th>Last name</th>
                                              <th>Email</th>
                                              <th>Last login</th>
                                              <th>No Of logins </th>
                                   </tr>
                                  </thead>
                                 <tbody>";
                                foreach ($this->result as $row) {
                                    echo "<tr>
                                            <td>{$row['customerid']} </td>
                                            <td>{$row['company']} </td>
                                            <td>{$row['firstname']} </td>
                                            <td>{$row['lastname']} </td>
                                            <td>{$row['email']} </td>
                                            <td>{$row['lastlogin']} </td>
                                            <td>{$row['count']}</td>
                                          </tr>";

                                     }
                                  echo "</tbody></table>";

and the jquery code is 

                        $(function () {
                         $("#tblCustomers").dataTable();
                         $("#tblCustomers tr").click(function(){
                         alert($(this).find('td:first').text());
                         });
                       });

Upvotes: 4

Views: 5521

Answers (3)

varun kumar
varun kumar

Reputation: 115

Please note that, even the search and filter won't take the row click event. if you are providing the events on row like click,double-click.

On filter and On search make sure you call that function which has all your custom scripts.

Upvotes: 0

Nishit Maheta
Nishit Maheta

Reputation: 6031

change code to below . this is call Event Delegation

    $(function () {
           $("#tblCustomers").dataTable();
           $(document).on('click',"#tblCustomers tr",function(){
                     alert($(this).find('td:first').text());
           });
    });

Upvotes: 7

Thor Jacobsen
Thor Jacobsen

Reputation: 8851

Try using $("#tblCustomers tr").on('click', function(){...} instead of the regular click..

Upvotes: 0

Related Questions