Replies

• colin Posts: 15,240Questions: 1Answers: 2,599

  January 2020

  This example from this thread seems to be doing what you want,

  Colin
• Isabelgh Posts: 10Questions: 0Answers: 0

  January 2020

  Hi Colin, thank you for your answer.

  I tried to do the same as in the example and add set these values for the scroller:

                  scrollResize: true,
                  scrollX: true,
                  scrollY: 100,
                  scrollCollapse: true,
  

  The scrollers are working fine on the table, but for some reason the table height gets very small and the height is not adjusted to the size of the whole window.

  Is it something I'm doing wrong here? stats is the the id of the table I have

   #stats {
      table-layout: relative;
      width: 100% !important;
      height: 100% !important;
      overflow: scroll;
  
    }
  
    #stats td,
    #stats th {
      width: auto !important;
      height: auto !important;
      white-space: normal;
      text-overflow: ellipsis;
    }
  
  
• colin Posts: 15,240Questions: 1Answers: 2,599

  January 2020

  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
• Isabelgh Posts: 10Questions: 0Answers: 0

  January 2020

  Thank you, here I have a testcase that replicates the issue I'm having:

  http://live.datatables.net/visageho/7/edit

  As can be seen, the scrollers are put on correctly on the table but the table height does not fit the window, it gets very small. Only the width of the table follows the window size.

  /Isabel
• colin Posts: 15,240Questions: 1Answers: 2,599

  January 2020

  If you change scrollY to be px or vh units, it appears to do what you want, see here.

  Colin
• Isabelgh Posts: 10Questions: 0Answers: 0

  January 2020

  Yes by putting scrollY to vh or px the height of the table does increase but it goes beyond the size of the browser window. I would like the height to not be longer than the window height so you can see the bottom of the table on one page.

  How can I have a table that will adjust to whatever the height/width of the window while still maintaining the scrollable feature?

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

  January 2020

  Maybe this blog about the scrollResize plugin will do what you want.

  Kevin
• Isabelgh Posts: 10Questions: 0Answers: 0

  January 2020

  Thank you for all your help! I was able to solve it by also adding a resize_wrapper around the datatable and it now works as I wanted.

  http://live.datatables.net/visageho/29/edit

  /Isabel