将click事件绑定到jQuery Datatable on()中的tr元素不起作用 [英] Binding a click event to tr elements in jQuery Datatable on() doesn't work
问题描述
我正在开发一个表,其中将包含我们所有的用户,也可以通过单击表行并以单击后打开的形式编辑数据来进行更改.
I am developing a table that will contain all our users which can also be changed by clicking the tablerow and editing the data in a form that will open once the click was performed.
如果我在页面加载时加载了所有用户,则我的代码可以正常工作.
If i have all the users loaded at page load, my code works fine.
一旦我更改了数据表以在数据表初始化时加载用户,它将仅在第一页上工作.
Once i change my datatable to load the users at datatable initialisation it will only work on the first page.
如果我取消注释ready(function())
的下部并删除fnInitComplete
,它将甚至无法在首页上显示.
If i uncomment the lower part of my ready(function())
and delete fnInitComplete
it wont even work on the first page.
这是我的代码的相关部分:
Here is the relevant part of my code:
$(document).ready(function(){
tbl = $('#nutzer').dataTable( {
"bJQueryUI": true,
"sScrollX": "100%",
"bProcessing": true,
"bServerSide": true,
"iDisplayLength": 10,
"sAjaxSource": "xhr.php",
"sPaginationType": "full_numbers",
"fnInitComplete": function() {
$('#nutzer tbody tr').on("click", function () {
aufklappen(this);
} );
}
} );
$( "#create-user" ).button().click(function() {
$( "#dialog-form" ).dialog( "open" );
});
// $('#nutzer tbody tr').on("click", function () {
// aufklappen(this);
// } );
});
function aufklappen(row) {
if ( tbl.fnIsOpen(row) ) {
tbl.fnClose(row);
} else {
set = tbl.fnSettings().aoOpenRows[0];
(set != null) ? (tbl.fnClose(set.nParent)) : null;
$.post("benutzerBearbeiten.php", {
funktion : "benutzerDaten",
id : $(row).children( "td:first-child" ).text()
}, function(data){
tbl.fnOpen( row, data);
$( "#deaktivieren").button().click(function(e){
e.preventDefault();
deaktivieren();
});
$( "#speichern").button().click(function(e){
e.preventDefault();
speichern();
});
}
) };
}
在通过数据表分页进行页面加载或页面更改后,我可以手动调用
After page load or page change through the datatables pagination i can manualy call
$('#nutzer tbody tr').on('click', function () {
aufklappen(this);
} );
和click函数完美地绑定到tr.
and the click function gets bound to the tr's perfectly.
在我看来,由datatables-plugin创建的元素并未使dom进入我定义的on()处理程序,但我不知道为什么.
Seems to me that the elements created by datatables-plugin are not getting up the dom to the on() handler that i defined but i cant figure out why.
利用系统重新启动"的答案,我最终删除了fnInitComplete
部分并添加
Utilising "The System Restart"s answer i ended up deleting the fnInitComplete
part and add
"asStripeClasses": [ "odd nutzer_tr", "even nutzer_tr"]
到初始化部分,然后
$("body").delegate(".nutzer_tr", "click", function () {
aufklappen(this);
});
到ready(function())
.附加的类nutzer_tr
是为了防止打开的表行关闭.
to the ready(function())
. The additional class nutzer_tr
is to prevent the opened tablerow from closing.
推荐答案
我认为您需要现场直播:
I think you need live event:
$('body').on('click', '#nutzer tbody tr', function () {
aufklappen(this);
});
或可以使用委托()
$('body').delegate('#nutzer tbody tr', 'click', function () {
aufklappen(this);
});
这篇关于将click事件绑定到jQuery Datatable on()中的tr元素不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!