【问题标题】:row click event not fired after pagination in bootstrap datatable在引导数据表中分页后未触发行单击事件
【发布时间】:2015-03-18 10:05:41
【问题描述】:

我正在使用引导数据表进行分页。我还向每一行添加了点击事件。但点击事件仅在第一页中触发。排序或分页后不起作用。这是我显示数据的 php 代码

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

jquery 代码是

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

【问题讨论】:

    标签: jquery datatable twitter-bootstrap-3


    【解决方案1】:

    将代码更改为以下。这是电话Event Delegation

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

    【讨论】:

      【解决方案2】:

      尝试使用$("#tblCustomers tr").on('click', function(){...} 而不是常规的click..

      【讨论】:

        【解决方案3】:

        请注意,即使是搜索和过滤也不会发生行点击事件。如果您在行上提供事件,例如单击,请双击。

        在过滤器和搜索时,请确保调用包含所有自定义脚本的函数。

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 2014-01-16
          • 1970-01-01
          • 1970-01-01
          • 2018-07-28
          • 1970-01-01
          • 2015-01-07
          • 1970-01-01
          相关资源
          最近更新 更多