Answers

• kthorngren Posts: 21,344Questions: 26Answers: 4,954

  March 2019

  The FixedHeader docs state this:

  Please note that FixedHeader is not currently compatible with tables that have the scrolling features of DataTables enabled (scrollX / scrollY). Please refer to the compatibility table for full compatibility details.

  You can also look at the Compatibility Matrix.

  Kevin
• Durgaprasad Nakka Posts: 5Questions: 2Answers: 0

  March 2019 edited March 2019

  Thanks kthorngren,
  in other pages also i have same scenario where it is working as expected, in this case only difference is my
  1) table inside tabs and collapse panel
  2) loading data as per drop down selection using $('#myTable').DataTable().destroy(); in onchange function.
  3) i have multiple tables in one page(html)

  suggest if i am missing anything
• kthorngren Posts: 21,344Questions: 26Answers: 4,954

  March 2019

  1) table inside tabs and collapse panel

  You can try columns.adjust() after displaying the panel.

  2) loading data as per drop down selection using $('#myTable').DataTable().destroy(); in onchange function.

  Not sure without seeing it.

  3) i have multiple tables in one page(html)

  Normally this is not a problem.

  suggest if i am missing anything

  As the docs state there is a known incompatibility with FixedHeader and Datatables scrolling features. The problem is due to how they are architected. They don't always work well together. You can remove one of them from your Datatable config.

  Kevin
• Durgaprasad Nakka Posts: 5Questions: 2Answers: 0

  March 2019

  kthorngen,
  i used columns.adjust() API here is my code please suggest

  CreateEmptyGuarateeDetailsGrid(gridName, gridContainer, gridID, gridHeadID, gridBodyID);

  if (resultData.length > 0)
  {
      $('#' + gridID).show();
  }
  
  for (var i = 0; i < resultData.length; i++)
  {
      LoadGuaranteeLineItem(gridName, gridContainer, gridID, gridHeadID, gridBodyID, resultData[i], IsPrefColumsToShow);
  }
  $('#' + gridID).dataTable().fnDestroy();
  $('#' + gridID).empty();
  $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
      $($.fn.dataTable.tables(true)).css('width', '100%'); $($.fn.dataTable.tables(true)).DataTable().columns.adjust().draw();
  
• colin Posts: 15,240Questions: 1Answers: 2,599

  March 2019

  Hi @Durgaprasad Nakka ,

  We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

  Cheers,

  Colin