[英]datatables jquery click event not working after pagination
<button class='btn btn-success activeAccount'>Activate Account</button>
我在 onclick 事件上觸發了 ajax 調用,下面是 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 版本的數據表
因為事件僅附加到現有元素。
您應該將其更改為:
$("#tableId").on("click", ".activeAccount", function(){
// your code goes here
});
在jQuery.on的文檔中閱讀更多內容。
$(document).on("click",".activeAccount",function(e){
// your code goes here
});
我遇到過同樣的問題。 每次我的 AJAX 函數(modalContentAjaxRefresh)更新表時,分頁停止。 所以我只需要更改我的代碼:
從:
$('.modal-toggle').off('click', modalContentAjaxRefresh).on('click', modalContentAjaxRefresh);
到:
$('#DataTables_Table_0_wrapper').on("click", ".modal-toggle", modalContentAjaxRefresh);
我在數據表中的按鈕是:
< 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">
正如@squaleLis 所說,該事件僅附加到現有元素。
因此,在我的例子中,我為按鈕定義了 onclick 事件並調用了它。
<button class='btn btn-success activeAccount' onclick="YourMethod();">Activate Account</button>
function YourMethod() {
....same code..
}
$("#product-list").on("click",".btn-delete-product",function(e){
e.preventDefault();
var prodId = $(this).attr("product-id");
.... code to delete the record from the db...
});
product-list是加載數據並啟用分頁的表。
這非常適合我。
我認為一個好的和簡單的解決方案是使用drawCallback
選項
最重要的是在單擊分頁時重新分配元素。
//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();
});
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.