How to keep both Datatable "click" and "dblclick" both

How to keep both Datatable "click" and "dblclick" both

Mahendra_PMahendra_P Posts: 2Questions: 1Answers: 0
edited December 2020 in Free community support

Hello.

I am facing issue in Data-table row selection. i want to select the the entire row on single click- so that i have already written some code to retrieve the particular id and its working. But now i have another feature to implement to open a modal on double click - i already implemented this too. but if i implement the dblclick event, the single click event is not working.

below code is to single click:

$('#datatableID tbody').on('click', 'tr', function () {
                var table = $('#datatableID ').DataTable();
                $('#datatableID tbody > tr').removeClass('selected_dtrow');
                $(this).addClass('selected_dtrow');
                var data = table.row(this).data().recordNumber; $("#hdnStatusId").val("");
                $("#hdnStatusId").val(data);
                console.log(data);
            });

now this is to dblclick:

            $('#datatableID tbody').off().on('dblclick','tr', function () {
                var table = $('#datatableID ').DataTable();
                //$('#datatableID tbody > tr').removeClass('selected_dtrow');
                //$(this).addClass('selected_dtrow');
                var data = table.row(this).data().recordNumber; $("#hdnStatusId").val("");
                $("#hdnStatusId").val(data);
                $('#modalTitle').html('Edit the job');
                let loader = '<div class="d-flex justify-content-center"><div class="spinner-border" role="status"><span class="sr-only"></span></div></div>';
                $("#modalid.modal-body").html(loader);
                $("#modalid").modal("show");
                $("#modalid.modal-body").load("/siteview/Upsert?scheduleId=" + data, function (data) {
                    if (data != null) { $("#hide-content").show(); }
                });
            });

Can anyone help me in this.
If i double click i want to open modal and single click i want to select row but after the implementation of dblclick the single click event not working.

Thank you

Answers

  • colincolin Posts: 15,112Questions: 1Answers: 2,583
    edited December 2020

    There are a few similar threads, such as this and this, that should get you going.

    If not, we're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

    Cheers,

    Colin

  • Mahendra_PMahendra_P Posts: 2Questions: 1Answers: 0

    Colin, Thanks for your answer, but didn't work. i tried hard, no help.
    I want to implement both click and dblclick.

    dblclick is working infinite time

  • kthorngrenkthorngren Posts: 20,141Questions: 26Answers: 4,735

    Having a click event and a double click event on the same element is tricky and a problem not specific to Datatables. Take a look at this SO thread and this SO thread for ideas of how you might implement this.

    Kevin

  • isi_dwadeisi_dwade Posts: 2Questions: 1Answers: 0
    edited February 2021
    var dTable = $("#tableID).DataTable({});
    
    $('#tableID tbody').on('dblclick', 'tr', function (e) {
       dTable.rows().deselect(); //force clear of any multiple selected rows
       dTable.rows(this).select();  //this will force-select the double clicked row
       <open dialog here>
    });
    
This discussion has been closed.