Reputation: 45
I have a DataTable (https://datatables.net) that is rendered dynamically. I have an on click event for the rows to bring up some data, I did from following this tutorial:
https://datatables.net/examples/advanced_init/events_live.html
I have a select box in the row that I excluded by doing this:
$('#resdatatable tbody').on('click', 'tr', function (e) {
if($(e.target).is('select')){
e.preventDefault();
return;
}
Which works perfectly.
But now I am trying to make the Data Table responsive, so I am following this tutorial: https://datatables.net/extensions/rowreorder/examples/initialisation/responsive.html
Which is working great, but I need to exclude the little green + from the on click event as well, and I am trying to do that with this:
$('#resdatatable tbody').on('click', 'tr', function (e) {
if($(e.target).is('select') || $(e.target).hasClass('dtr-column') ){
e.preventDefault();
return;
}
But it isn't working, I have no idea how to make this work or how to identify this little green or red button.
EDIT: Another way of doing this would be to exclude a click on the first column.
EDIT 2:
Using this:
$('#resdatatable tbody').on('click', 'tr:not(:first-child)', function (e) {
if($(e.target).is('select')){
e.preventDefault();
return;
}
Disables the first row, but not the first column...?
Upvotes: 1
Views: 729
Reputation: 45
This is the way I solved the problem, it works perfectly:
if($(e.target).is('select') || $(e.target).is('td:first-child') ){
e.preventDefault();
return;
}
Upvotes: 2