Datatables - M-скрипты не работают ни на одной другой странице, кроме первой. Как это исправить?

Question

У меня есть следующий jquery, который помещает меню редактирования, просмотра и удаления под определенными ячейками.Он отлично работает на первой странице, но как только я попадаю на вторую страницу, он не работает:

$(document).ready(function() {
$("#table-list-users tr td#dropmenu").hover(function(){
    var data = $(this).closest('tr').find('.phonenumber').text() ;
    var data_clean =data.trim();
    //console.log(data);
    var xxx = '<div> <a href=/MH_auth_admin/edit_user/' + data_clean +' >edit</a> | view | delete </div>';
    console.log(xxx);
    $(this).append(xxx) }, function(){
        $(this).children("div").remove();
    })
});

У меня также есть следующий скрипт php, который просто добавляет всплывающую подсказку:

   <?php 
    if (empty($user->created_on)){
     ?>     
    <td>
    <!-- empty -->
    </td>

    <?php
    } else {
    ?>                                      

    <td data-original-title="
        <?php 
            if (isset($user->created_on) ){
                $the_date_created = unix_to_human(htmlspecialchars($user->created_on,ENT_QUOTES,'UTF-8'));
                $the_text_created = new Cokidoo_Datetime($the_date_created);
                $created_on_tooltip = $the_text_created ;
                echo $created_on_tooltip;
            }
        ?>  
        " data-container="body" data-toggle="tooltip" data-placement="bottom" title="">

        <?php 
        if (!empty($user->created_on)){
            echo unix_to_human(htmlspecialchars($user->created_on,ENT_QUOTES,'UTF-8'));
        }
        ?>
</td>

<?php
    }
?>

Оба отлично работают на первой странице, но как только я перехожу на любую другую страницу, они не работают.

Как я могу это исправить?

Answer 1

Вам необходимо заменить логику создания всплывающей подсказки на функцию рендеринга в datatable, имеющую значение columnDefs
Ваши данные должны содержать поля tooltip и created_on.

$("#table-list-users").datadable({
  // ...
  // there can be other options
  // ...
  columns: [          
      { data: "created_on"}
  ],
  columnDefs: [
    {
      render: function (data, sType, aData) {
         return '<span data-original-title="' +
          aData.tooltip +
          '" data-container="body" data-toggle="tooltip" data-placement="bottom" title="">' +
          aData.created_on +
          '</span>';
      },
      targets: [0] // number of column created_on
    }
  ]
});