Replies

• allan Posts: 63,542Questions: 1Answers: 10,476 Site admin

  May 2012

  If I understand correctly, you are replacing the entire "old" table's HTML with your new HTML. Is that correct? DataTables won't like that, because you haven't told it that the old table has been overwritten, and it has now way of knowing that is the case. What you can do if you want to overwrite the whole table is use fnDestroy and then carry on as normal.
  
  Allan
• boyakoosha Posts: 8Questions: 0Answers: 0

  May 2012

  Allan, I am doing that yes you are correct. When to call fnDestroy?
• allan Posts: 63,542Questions: 1Answers: 10,476 Site admin

  May 2012

  Just before you replace the HTML. That will allow DataTables to release the table, so you can then nuke it.
  
  Allan
• boyakoosha Posts: 8Questions: 0Answers: 0

  May 2012

  Ok so I tried this:
  // redraw the table
  $('#userTable').dataTable().fnDestroy(true);
  // refresh the grid, ajax in the background
  $('#userList').load('/Settings/UserDetails', function () {
  jQuery('#userTable').dataTable({
  "sPaginationType": "full_numbers",
  "aaSorting": [[0, "asc"]], // 0 = column to sort by
  "bProcessing": true
  });
  });
  
  using fnDraw() instead of the whole init script (it's there for testing) draws the table properly now, but the hyperlinks in the end column don't respond to clicks, very odd. If I inspect the re rendered HTML after, everything is the same, the class names on the edit/delete links are the same so they should be picked up fine by the jQuery that handles their click events.
  
  Any other ideas?
• allan Posts: 63,542Questions: 1Answers: 10,476 Site admin

  May 2012 edited May 2012

  > so they should be picked up fine by the jQuery that handles their click events.
  
  If you are using live events then yes - are you? Does Visual Event show events attached to the elements: http://sprymedia.co.uk/article/Visual+Event+2
  
  Allan
• boyakoosha Posts: 8Questions: 0Answers: 0

  May 2012

  I will check after the weekend and let you know.
  
  Thanks a lot for your help Allan
• boyakoosha Posts: 8Questions: 0Answers: 0

  May 2012 edited May 2012

  ok tried that with the following
  $('#userTable').dataTable().fnDestroy(true);
  
  $("#userTable").trigger("refreshUserList");
  
  which in turn calls the new ON function but still Edit and Delete don't work. Interestingly if I don't call any datable refreshing and simply let the LOAD command run, Edit and Delete do work it's only when trying to do anything with the datatable after a reload of the new data that it doesn't work.
  
  $("#userTable").on("refreshUserList", function () {
  
  // refresh the grid, ajax in the background
  $('#userTable').load('/Settings/UserDetails', function () {
  jQuery('#userTable').dataTable({
  "sPaginationType": "full_numbers",
  "aaSorting": [[0, "asc"]], // 0 = column to sort by
  "bProcessing": true
  });
  });
  });
• allan Posts: 63,542Questions: 1Answers: 10,476 Site admin

  May 2012

  How are you doing the edit and delete event handlers? With 'live' or delegated event handlers? ( http://datatables.net/faqs#events ).
  
  Allan
• boyakoosha Posts: 8Questions: 0Answers: 0

  May 2012

  Rendered as HTML on the page in a for loop -
  
  Edit   Delete
  
  the datatables are initialized in the document.ready declaration
• boyakoosha Posts: 8Questions: 0Answers: 0

  May 2012

  Man, still getting nowhere with this. anyone able to help please?
• boyakoosha Posts: 8Questions: 0Answers: 0

  May 2012

  Ok ok after a day of a lot of trial and error I've got it all sorted! :)