CODEWITHSUNDEEP
javascriptjquerydatatablesjquery-events
chrismead
chrismead

Reputation: 2243

Paging and double click with jQuery datatable

After lots of reading posts and fiddling, I thought this was working to attach a doubleclick 'handler' to each row of my jQuery datatable:

   $('#myTable').find('tr').dblclick( function(e){
        var ref = $(this).find('td:first').text();
        someThingToDoWithTextFromFirstCell(ref);
   });

Unfortunately, this only seems to work for rows on the first page. I tried doing something like this as a workaround (basically do the same thing when paging):

   $('#myTable').on('page', function () {
       $('#myTable').find('tr').dblclick( function(e){
          var ref = $(this).find('td:first').text();
          someThingToDoWithTextFromFirstCell(ref);
       });
     } );

However, when it fires there are no tr's found so nothing happens. I assume the event is firing before the datatable has new rows?

Does anyone know how I can get this to work?

Here is a JS Fiddle example, Nikola. Thanks for your time. Double click a row and get an alert, click next and double click a row and get no alert. JS Fiddle example

This is what you can add in for the workaround that doesn't work:

 $('#example').on('page', function () {
   $('#example').find('tr').dblclick( function(e){
      var ref = $(this).find('td:first').text();
      alert(ref);
   });
 } );

Upvotes: 2

Views: 10664

Answers (1)

user2590805
user2590805

Reputation: 420

You could find answer here.

So, for dynamically created elements you should use:

$(document).on("dblclick", "#myTable tr", function () {
    //code here
});

Upvotes: 4

Related Questions