Datatables jquery click event не работает после разбивки на страницы

Я использую http://datatables.net/

<button class='btn btn-success activeAccount'>Activate Account</button>

Я запускаю ajax-вызов по событию onclick, ниже приведен код вызова ajax:

$(".activeAccount").click(function() {
  var intCounselorId = $(this).parent().parent().find('input[class="counselorId"]').attr("value");
  var intOwnerId = $(this).parent().parent().find('input[class="userID"]').attr("value");
  var strAction = 'activateAccount';
  performAction(intCounselorId, intOwnerId, strAction);
});

function performAction(intCounselorId, intOwnerId, strAction) {
  $.ajax({
      url: '/admin/counselormanagement/expertmanagementgridaction',
      data: 'intCounselorId='+intCounselorId+'&intOwnerId='+intOwnerId+'&strAction='+strAction,
      type: "POST",
      async:false,
      success: function(intFlag) {
        if(intFlag == 1){
          location.reload();
        }
      }
  });
}

Я пытаюсь запустить событие onclick, которое обычно работает на первой странице, но как только я перехожу на страницу 2 (или любую другую), оно перестает работать.

Я использую jquery-1.10.2.min.js и 1.9.4 версию datatable

Ответы

Ответ 1

Поскольку событие привязано только к существующим элементам.

Вы должны изменить его на:

$("#tableId").on("click", ".activeAccount", function(){
   // your code goes here
});

Подробнее в документации jQuery.on.

Ответ 2

Как сказал @squaleLis, событие прикреплено только к существующим элементам.

Итак, в моем случае я определил событие onclick для кнопки и вызвал ее.

  <button class='btn btn-success activeAccount' onclick="YourMethod();">Activate Account</button>

  function YourMethod() {
     ....same code..
  }

Ответ 3

Я была такая же проблема. Каждый раз, когда моя функция AJAX (modalContentAjaxRefresh) обновляет таблицу, остановка подкачки. Так что я просто должен был изменить свой код с:

От:

$ ('. modal-toggle'). off ('click', modalContentAjaxRefresh).on('click', modalContentAjaxRefresh);

чтобы:

$ ('# DataTables_Table_0_wrapper'). On ("click", ".modal-toggle", modalContentAjaxRefresh);

Моя кнопка внутри datatable:

<a title= "Edit" class= "btn btn-xs btn-info modal-toggle "
data-style = "zoom-in" href= "/setting/account/{{account_turn.uuid}}/update" data-toggle = "modal" data-target = "# editAccount" wecare-method = "GET">

Ответ 4

Главное - переназначить элементы при нажатии на нумерацию страниц.

//function to assign event
var assign_actions = function(){
  //Some code  
}
  //when the page is ready
  $( document ).ready(function() {
    assign_actions();
    //Code to assign event when paginate
     $('.paginate_button').on('click', function(){
       assign_actions();
     });
   });