How to simulate a mouse click in a datatables?

Question

I would like to simulate a mouse click in my datatables (I'm using Datatables plugin to make the table) when I click on the Edit button to open the inline editor in my table. For this I use $("#datatable td").trigger("click"); , it's work but with this method the inline editor open for each line of the table and I would like to open the inline on the line where the button is and not everywhere.

JS :

$("#datatable").on("click", "#btn_ed", function () {
    $("#datatable td").trigger("click");
});

Answer 1

Use closest to find the td belonging to the button:

$(document.body).on('click','.editBtn', function() {
    $(this).closest('td').trigger("click");
});

This assumes your edit buttons have the class editBtn .

Also take note that I'm using the three-parameter method, which will make the click handler work even when new td s are being added later on.

I see you added a code snippet to your question which uses an id to select the edit buttons. This is bad practice, the id of an element should be unique and the selector should apply to only one result. It is better to use a class for all edit buttons.

Answer 2

Try this, Hope it helps

 $("#datatable").on("click", "#btn_ed", function () {

             $(this).closest('tr').find('td').each(function(e){

                   $(this).trigger('click')  

            })
    });