Click Event on row Fires before [+] click on responsive page

vpalhories

Hello,

I've implemented a responsive datatable using the responsive:true option which visually works exactly as expected. I've also implemented a click event on the row via the following JQuery:

 $('#contacts tbody').on('click', 'tr', function () {
                var currentRowData = table.row(this).data();
                var id = $(this).attr("id");
                var url = "@Url.Action("View", "Contact")?id=" + id;
                window.open(url,"_parent");
            });

The issue I'm having is that when the user shrinks the width of their browser (or they use a mobile or tablet device) they cannot expand the row by tapping on the [+] icon because the Click event fires first.

Any ideas on how this can be remedied?

Thanks a bunch.

--- Val

kthorngren

Maybe you can remove the first column from your click event selector by doing something like this:

$('#contacts tbody').on('click', 'td:not(:first-child)', function () {

You can place the Responsive control in its own column as shown in this example.

Kevin

vpalhories

Thank you so much @kthorngren . This set me down the right path. I appreciate the feedback.

--- Val