таблица данных jquery не работает со второй страницы

Question

Я использую таблицу данных jquery 1.9.4 и jquery 1.9.1, и я пытаюсь выполнить такой вызов ajax, как это при событии click.

$(".icon-trash").on('click',function() { 
       // alert($(this).attr('id')); 
       $.post('/WorkOrderRequest/DeleteWOR', 
         { id: $(this).attr('id') }, 

         function (returndata) 
         { 

          if (returndata.ok) 
          { 
           window.alert(' deleted!'); 
           $("#emp" + idemployee).hide('slow'); 
          } 
          else { 
           window.alert(' error : ' + returndata.message); 
          } 

        }); 

      }); 

HTML часть:

@foreach (var item in Model) 
        { 

         <tr> 
          <td> 
           @Html.DisplayFor(modelItem => item.ProjectCode) 
          </td> 
          <td> 
           @Html.DisplayFor(modelItem => item.WO_Date) 
          </td> 


          <td> 
          <a id='@(item.WO_ID)' class="icon-edit" /> 
           |        
          <a id='@(item.WO_ID)' class="icon-trash" /> 
          </td> 
         </tr> 
        } 

Он работает отлично на первой странице, но со второй страницы, его не показывает какого-либо результата. Пожалуйста, помогите

Answer 1

Способ разбивки на страницы, строки, которые не нужны текущей странице, удаляются из DOM. Поэтому любые обработчики событий, которые вы связываете непосредственно с этими элементами, теряются при удалении html.

Для привязки обработчика к активу на постоянной странице вам необходимо использовать синтаксис делегирования on(). Это может быть родительской таблицы или любой другой родитель до дерева, в том числе document

$('#TableID').on('click','.icon-trash',function() {... 

API Reference: http://api.jquery.com/on/

Answer 2

Если вы просто разместить код события щелчка выше datatable кода в js, он будет работать нормально.

В качестве примера.

$(".icon-trash").on('click',function() {}); 

$("#TableID").datatable(); 

Answer 3

У меня такое же проблема, и я решил ее двигаться вниз ниже код строки на последнюю

$('#yourTable').dataTable();

Надеется, что это поможет кому-то.