Replies

• bpeterson76 Posts: 11Questions: 0Answers: 0

  January 2011

  Allan, would destroying any previously rended datatables prior to starting a new one possibly have any effect on this error? Should I move this to bug reports?
• ssgoh Posts: 3Questions: 0Answers: 0

  September 2011 edited September 2011

  Hi bpeterson76, have you managed to resolve this issue? I also having same problem when partial postback from page and returned error "Cannot read property '_iDisplayStart of null in jquery.datatables.js
  
  I debugged it and it shows oTable settting is null when the I do my .Net partial postback.
  
  I put this but is not working too. Does you have any suggestion?
  
  my code:
  
  Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
  function EndRequestHandler(sender, args) {
  if (args.get_error() == undefined) {
  partialPostBack();
  }
  }
  
  function partialPostBack() {
  
  var oTable;
  //... oTable = $("#example").dataTable(....
  }
• allan Posts: 63,400Questions: 1Answers: 10,451 Site admin

  September 2011

  Can you link us to your example please? I'm not sure why oTable would be null from your description?
  
  Thanks,
  Allan
• ssgoh Posts: 3Questions: 0Answers: 0

  September 2011 edited September 2011

  [code]
  
  
  $(function () {
  partialPostBack();
  });
  
  function fnFormatDetails ( oTable, nTr )
  {
  var aData = oTable.fnGetData( nTr );
  var sOut = '';
  sOut += 'Rendering engine:'+aData[1]+'';
  sOut += 'Link to source:Could provide a link here';
  sOut += 'Extra info:And any further details here (images etc)';
  sOut += '';
  
  return sOut;
  }
  
  function createDetailsElement(){
  
  var nCloneTh = document.createElement( 'th' );
  var nCloneTd = document.createElement( 'td' );
  nCloneTd.innerHTML = '';
  //nCloneTd.className = "center";
  $('#example thead tr').eq(0).each( function () {
  if ($(this).find('th').length==3)
  this.insertBefore( nCloneTh.cloneNode( true ), this.childNodes[0] );
  } );
  $('#example thead tr').eq(1).each( function () {
  if ($(this).find('th').length==3)
  this.insertBefore( nCloneTh.cloneNode( true ), this.childNodes[0] );
  } );
  
  $('#example tbody tr').each( function () {
  this.insertBefore( nCloneTd.cloneNode( true ), this.childNodes[0] );
  } );
  }
  
  function partialPostBack() {
  
  var oTable;
  
  $('#example tbody td img').live("click",function (events) {
  var nTr = this.parentNode.parentNode;
  if (this.src.match('expand_minus')) {
  /* This row is already open - close it */
  this.src = "http://localhost:2205/Test/images/expand_plus.gif";
  oTable.fnClose(nTr);
  }
  else {
  /* Open this row */
  this.src = "http://localhost:2205/Test/images/expand_minus.gif";
  oTable.fnOpen( nTr, fnFormatDetails(oTable, nTr), 'details' );
  }
  });
  
  //example
  oTable = $('#example').dataTable({
  "bJQueryUI": true,
  "bSort": true,
  "bProcessing": false,
  "bServerSide": true,
  "bAutoWidth": true,
  "bRetrieve" : true,
  "sAjaxSource": "Webservices/DataTableTestService.svc/GetTable",
  "fnServerData":
  function (sSource, aoData, fnCallback) {
  $.ajax({
  "datatType": 'json',
  "contentType": 'application/json',
  "url": sSource,
  "data": aoData,
  "success": function (msg) {
  var json = $.parseJSON(msg);
  fnCallback(json);
  createDetailsElement();
  }
  })
  }
  });
  }
  
  Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
  function EndRequestHandler(sender, args) {
  if (args.get_error() == undefined) {
  partialPostBack();
  }
  }
  
  
  
  
  
  
  ID
  Name
  Desc
  
  
  
  
  
  
  
  
  
  
  Please wait...
  
  
  
  
  
  <!-- this is a user control in .Net and it will call the "javascript:__doPostBack('ctl00$cphMaster$Page1$test','')"//-->
  
  
  
  [/code]
  
  Description:
  I have a master page in .Net application. The master page has an update panel.
  The entire code is a user control and it is inside the update panel.
  I click on the test link button and do a partial postback.
  Then, I click on the img to expand the details of the 'example' dataTable.
  I got the error : "Cannot read property '_iDisplayStart of null in jquery.datatables.js"
• allan Posts: 63,400Questions: 1Answers: 10,451 Site admin

  September 2011

  Can you post a link please? That's quite a lot of code for me to get my head around quickly and there is dynamic code in there as well :-)
  
  Allan
• ssgoh Posts: 3Questions: 0Answers: 0

  September 2011 edited September 2011

  Thank you but I tried out another way already where i return my message and put it in the right side of the dataTable and set position fixed. It is easier to read the row that has been clicked and view the details on the right side of the DataTable for me.
  
  //example DataTable
  $("#example > tbody > tr")
  .live('click', function (event) {
  
  var id = $(this).find(':checkbox').attr('id');
  $("#desc").html(getMessage(id));
  
  });
  
  
  
  
  
  
  ID
  
  
  Name
  
  
  Desc
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  Please wait...