Вызов DataTable с использованием Function и получение данных TD при нажатии, но при этом появляется сообщение об ошибке «Не удается прочитать свойство« 0 »из неопределенного»

Question

У меня проблемы с получением данных <td> для таблицы, но я получаю эту ошибку " Невозможно прочитать свойство '0' из неопределенного ".

что я хотел , когда я нажимаю <tr> таблицы, предполагается, что для получения данных <td>.

Этот код работает нормально и получает результат.

  var my_table= jQuery('#my_table').DataTable({
         "lengthChange": false,
         "autoWidth": false,
         "searching": true,
         "ordering": false,
         "processing":true,
         "serverSide":true,
         "order":[],
         "ajax":{
           url:"admin-ajax.php",
           data:{action:"table_json"},
           type:"POST"
         },
         "columnDefs":[
           {
             "targets":[0],
             "orderable":false,
           },
         ],
  });
jQuery('#my_table tbody').on( 'click', 'tr', function () {
     var data = my_table.row( this ).data() ;
     console.log(data[0]);
} );

, но когда я заверну это на примере функции:

function call_thisTable(ParameterA,ParameterB){
 var my_table= jQuery('#my_table').DataTable({
             "lengthChange": false,
             "autoWidth": false,
             "searching": true,
             "ordering": false,
             "processing":true,
             "serverSide":true,
             "order":[],
             "ajax":{
               url:"admin-ajax.php",
               data:{action:"table_json"},
               type:"POST"
             },
             "columnDefs":[
               {
                 "targets":[0],
                 "orderable":false,
               },
             ],
      });
    jQuery('#my_table tbody').on( 'click', 'tr', function () {
         var data = my_table.row( this ).data() ;
         console.log(data[0]);
    } );
}

Затем каждый раз, когда я нажимаю кнопку, я сначала уничтожаю таблицу, чтобы заново инициализировать содержимое, и вызываю эту функцию call_thisTable(A,B).

jQuery(document).on("click",".click_button",function(){
  var A = jQuery(this).attr("data-a");
  var B = jQuery(this).attr("data-b");

  $('#my_table').DataTable().destroy();
  call_thisTable(A,B);
});

При первом вызове call_thisTable(A,B); вы получите нужные данные, но при втором, третьем и т. Д. Вы получите ошибку « Cannot read свойство '0' undefined ».

Answer 1

Что-то не так с этой строкой кода.

    $('#my_table').DataTable().destroy();

Вы инициализируете объект данных и одновременно уничтожаете его. Попробуйте избавиться от

    DataTable()

в этой строке.

Answer 2

Спасибо @Afdufsko, чтобы исправить эту проблему. я выкатил инициализацию данных вне функции.

var my_table= jQuery('#my_table').DataTable({
             "lengthChange": false,
             "autoWidth": false,
             "searching": true,
             "ordering": false,
             "processing":true,
             "serverSide":true,
             "order":[],
             "ajax":{
               url:"admin-ajax.php",
               data:{action:"table_json"},
               type:"POST"
             },
             "columnDefs":[
               {
                 "targets":[0],
                 "orderable":false,
               },
             ],
      });
function call_thisTable(my_table,ParameterA,ParameterB){
    jQuery('#my_table tbody').on( 'click', 'tr', function () {
         var data = my_table.row( this ).data() ;
         console.log(data[0]); 
         //do some ajax here
    } );
}

Затем, вместо того, чтобы уничтожить базу данных для запуска нового содержимого, я использовал ajax.reload().

jQuery(document).on("click",".click_button",function(){
  var A = jQuery(this).attr("data-a");
  var B = jQuery(this).attr("data-b");

  $('#my_table').ajax.reload();
  call_thisTable(my_table,A,B);
});