Answers

• phi1ipp Posts: 6Questions: 1Answers: 0

  April 2019

  False alarm... I think the issue is on my side again. I was prepping a fiddle and found that it works, when I load all the libraries from CDN. In my project I pull them bundled. As I had few issues trying to make it work together with webpack, I guess it's something in this area.

  const JSZip = require( 'jszip' );
  window.JSZip = JSZip;
  
  require( 'datatables.net-bs4' );
  require( 'datatables.net-buttons-bs4' );
  require( 'datatables.net-buttons/js/buttons.flash.js' );
  require( 'datatables.net-buttons/js/buttons.html5.js' );
  require('datatables.net-bs4/css/dataTables.bootstrap4.min.css');
  require('datatables.net-buttons-bs4/css/buttons.bootstrap4.min.css');
  
  $(document).ready(() => {
      // add export button for Members page
      // in the same row with other controls
      if (/Members/.test(window.location)) {
          $("#datatable").DataTable({
              buttons: [{ extend: 'excel', text: 'Download as XLS' }],
              dom:
                  "<'row'<'col-sm-3'l><'col-sm-6 text-center'B><'col-sm-3'f>>" +
                  "<'row'<'col-sm-12'tr>>" +
                  "<'row'<'col-sm-5'i><'col-sm-7'p>>"
          });
      } else {
          $("#datatable").DataTable();
      }
  });
  
• phi1ipp Posts: 6Questions: 1Answers: 0

  April 2019

  That's what I see
  and I believe it's b/c of footer class which has

  .footer {
      position: absolute;
      bottom: 0;
      height: 60px; 
  }
  

  I see this happening when there is a text wrap in cells. So if I make my window fully wide open, then there is no collapse.
• phi1ipp Posts: 6Questions: 1Answers: 0

  April 2019

  turned out it's Bootstrap default behavior, sorry for the false alarm!

  the solution is to apply, maybe it will help somebody in the future

  body {
      bottom-padding: 60px;
  }