Single and double click does not work together

Honeydew

I am trying to implement both single click and double click of the row but it is not working. Here is the code:

        $('#tblEmployee').on('click', 'tbody td:not(:first-child)', function () {
            alert('single click');
            // do something on single click
        });

        $('#tblEmployee').on('dblclick', 'tbody td:not(:first-child)', function () {
            alert('double click');
            var table = $('#tblEmployee').DataTable();
            var row = table.row(this.closest('tr')).data();
            console.log(row.MId);
          // do something on double click 
        });

Whether I click single or double it always execute first function and never call the second, any idea why it is so and how can I resolve it?

Thanks

colin

Hi @Honeydew ,

This simple test is getting both. It must be something else in your code. Could you modify that example so that it demonstrates your problem, please.

Cheers,

Colin

Honeydew

I checked your example and when I do double click on any row the console.log shows 'single click' twice followed by 'double click'. So that means it calls first function twice as well as second function also. I don't want to call the first function on double click, so why it is calling it twice?

kthorngren

It seems having both click and double click on the same element requires some extra code to make it work. This SO thread has some options. This is not a Datatables issue but a general issue. I suggest picking the option that works best for your environment.

Kevin