TAGS :Viewed: 12 - Published at: a few seconds ago

[ Jquery Data Table row event getting stuck if i move between the Pages ]

I have a Jquery Datatable , with each row having "more" link, which will show the full text on clicking. It's working on every page except when I click a row and go to the next page and come back again, it does nothing (stuck). But if I try to move to any other next page and come back, it'll start working. It works fine in debug mode also.

Here is the code sample:-

  $(table).bind( 'draw', clickMore); 

function clickMore (moretext,lesstext) {

    $('#notesTable tbody tr td').on('click', '.morelink', function(){
            if ($(this).hasClass("less")) {
            } else if($(this).hasClass("more")){
            } else if($(this).hasClass("morelink")){

            return false;

any help would be great.

Answer 1

Attach click event handler as shown below:

$('#notesTable tbody').on('click', '.morelink', function(){


You attach event handler directly to td elements but with jQuery DataTables only current (first) page elements exist in DOM.