Answers

• kthorngren Posts: 22,310Questions: 26Answers: 5,127

  February 27 Answer ✓

  I believe the issue is discussed in this thread. The key is this comment from Allan:

  The issue is that the header container must have overflow: hidden - otherwise the parts that are out of scroll view would be visible

  If you change the option scrollY size to include more rows you should see part or all of the button dropdown.

  I made this simple test case:
  https://live.datatables.net/guwafemu/608/edit

  Changed the CSS to use position: fixed:

  div.dropdown {
      display: none;
      position: fixed;
  

  And changed the selector to append the dropdown the `

  table.on('click', 'button.dropdown', function (e) {
      e.stopPropagation();
   
      tr = this.closest('tr');   // Assign the closest clicked tr to the global tr varaible
      // Display and position the dropdown
      actions.appendTo( '#example thead' ).css({
  

  The button click events will need changing as well. The test case has a glable tr varaible created and it is set in the button.dropdown click event, shown above. This variable is used as the target for the edit operations in the button click events, for example:

  // Edit button
  table.on('click', 'button[value="edit"]', function (e) {
      editor.edit(tr, {
  

  @allan or others may have better suggestions.

  Kevin
• MarkAndersonUK Posts: 53Questions: 21Answers: 0

  February 27

  thankyou @kthorngren , i missed that thread when I searched. I assumed it was exactly this and related to the need for scroller to hide overflow to work.

  my 'scrollY' setting is basically 100vh (minus a little bit for overhead), and the problem only really affects me on the last few rows of the page, or when a 'search' filter is applied which causes the returned row count to drop to 1 or 2).

    I am interested in your demo and using a fix appending the actions to the thead.      however,  for some reason the link you gave doesn't work for me and I get a cloudflare timeout at the host when I try to access the live.datatables.net  site.        
  

  Perhaps you could PM me the javascript code you used?

  Luckily I am not using the editor.edit ( due to requirements I wrote a separate editor page that I call).

  Thanks again for all your information.

  Regards.
• kthorngren Posts: 22,310Questions: 26Answers: 5,127

  February 27

  Looks like the live.datatables.net site is down at the moment. Once @allan brings it back up you should be able to access the code.

  Kevin
• allan Posts: 65,287Questions: 1Answers: 10,824 Site admin

  February 28

  Apologies - it is back up now!

  Allan
• MarkAndersonUK Posts: 53Questions: 21Answers: 0

  February 28

  thanks you both @kthorngren and @allen