Answers

• Avalanche7592 Posts: 4Questions: 1Answers: 0

  February 13

  Here is a screen capture of the issue. If you watch, as I resize and drag the browser window to the right to make it bigger, there is enough space, but the datatable is redrawing and still clipping the last column off.
  As I drag it left and make the window smaller, it is redrawing up until it is at the minimum size then stops redrawing.

  
• kthorngren Posts: 22,150Questions: 26Answers: 5,100

  February 14 edited February 14

  Previously there was a recommendation to add style="width:100%" to the table for Datatables to perform width calculations. I believe recently Datatables now adds this attribute to the table tag when initialized.

  See this example for the current behavior.

  I believe the expectation now is to control the table width by setting the width of the .dt-container div.

  This change might be interfering with something you have setup. Can you provide a link to a test case showing the issue so we can take a look? Possibly just build a simple example with an example of your table tag and container that Datatables is in would be enough.
  https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

  Kevin
• Avalanche7592 Posts: 4Questions: 1Answers: 0

  July 2

  I have tried to create a test case, but have not been successful. My data comes from ajax and may be related.

  I have looked through the changes between 2.1.8 and the latest and found the problem in the "function _fnColumnSizes"

  If I update the code to the following, it works correctly:

  if (settings.oScroll.sX) {
      cols[i].colEl.css('min-width', 0);
  }
  

  I think this is the correct solution to set the min-width to zero.
• allan Posts: 64,729Questions: 1Answers: 10,709 Site admin

  July 2

  If you can provide me with a test case showing the issue, I can take a look into it. The table width for scrolling is easily the most complex part of DataTables, just because there are so many nuances - this could have other adverse side effects - I'm not sure!

  Allan
• Avalanche7592 Posts: 4Questions: 1Answers: 0

  July 10

  I tried to create a very simple case but I could not do it with live.datatables.net.

  I created a test solution which shows the exact problem here: https://github.com/ejohnson-dotnet/TodoApp

  Clone this git repo and open the solution with Visual Studio or Visual Studio Code. You will need dotnet 9.0 SDK installed.

  Simply build and run the solution to see the issue. Resize the window and the last column gets cut off even when it has enough space.

  It is using the minified version of DataTables.net 2.3.2 in the folder wwwroot/libs/datatables.net/js. Find the code colEl.css("min-width",a) and change it to colEl.css("min-width",0) and the columns gets resized properly.
• allan Posts: 64,729Questions: 1Answers: 10,709 Site admin

  July 10

  Many thanks. Debugging a .NET app is beyond what I can do just at the moment (I'm away from my office for a bit), but I will attempt to look into it next week.

  Allan
• allan Posts: 64,729Questions: 1Answers: 10,709 Site admin

  1:38PM edited 1:44PM

  I'm not having much luck getting this to run on Linux with .NET 9. Are you able to put the app up somewhere so I can just take a look at the generated output? Or perhaps the docker option will work - it says to run some scripts in etc, but there is no such dir in in the repo. If you have that, perhaps you could commit that?

  Edit: I was looking at the wrong level. I see etc now and will spend a bit more time on it.

  Allan
• allan Posts: 64,729Questions: 1Answers: 10,709 Site admin

  1:46PM

  $ sudo docker compose up
  [+] Running 4/4
   ! todoapp-web Warning      pull access denied for todoapp, repository does not exist or may require ...                      2.1s 
   ! db-migrator Warning      pull access denied for todoapp, repository does not exist or may require ...                      2.0s 
   ✔ sqlite Pulled                                                                                                              5.4s 
     ✔ 9824c27679d3 Pull complete                                                                                               2.7s 
  Compose now can delegate build to bake for better performances
  Just set COMPOSE_BAKE=true
  [+] Building 1.1s (9/12)                                                                                            docker:default
   => [db-migrator internal] load build definition from Dockerfile.local                                                        0.0s
   => => transferring dockerfile: 285B                                                                                          0.0s
   => [todoapp-web internal] load build definition from Dockerfile.local                                                        0.0s
   => => transferring dockerfile: 285B                                                                                          0.0s
   => [todoapp-web internal] load metadata for mcr.microsoft.com/dotnet/aspnet:9.0                                              0.9s
   => [db-migrator internal] load .dockerignore                                                                                 0.0s
   => => transferring context: 2B                                                                                               0.0s
   => [todoapp-web internal] load .dockerignore                                                                                 0.0s
   => => transferring context: 2B                                                                                               0.0s
   => CANCELED [db-migrator 1/3] FROM mcr.microsoft.com/dotnet/aspnet:9.0@sha256:7269109eb94f0f63cb99179a032d697ee06e5873901b7  0.1s
   => => resolve mcr.microsoft.com/dotnet/aspnet:9.0@sha256:7269109eb94f0f63cb99179a032d697ee06e5873901b7cd611bcba5553257558    0.0s
   => => sha256:7269109eb94f0f63cb99179a032d697ee06e5873901b7cd611bcba5553257558 1.08kB / 1.08kB                                0.0s
   => => sha256:658885b6c4728354c492200b7e3d36cd17ef96de58bb640ec0c5068048eb5cde 2.51kB / 2.51kB                                0.0s
   => => sha256:5974cda000d8c196801708381aec090ccea0e151dccf45268c22cadb39ff691b 1.58kB / 1.58kB                                0.0s
   => [todoapp-web internal] load build context                                                                                 0.0s
   => => transferring context: 2B                                                                                               0.0s
   => [db-migrator internal] load build context                                                                                 0.0s
   => => transferring context: 2B                                                                                               0.0s
   => ERROR [todoapp-web 2/3] COPY bin/Release/net9.0/publish/ app/                                                             0.0s
   => ERROR [db-migrator 2/3] COPY bin/Release/net9.0/publish/ app/                                                             0.0s
  ------
   > [todoapp-web 2/3] COPY bin/Release/net9.0/publish/ app/:
  ------
  ------
   > [db-migrator 2/3] COPY bin/Release/net9.0/publish/ app/:
  ------
  failed to solve: failed to compute cache key: failed to calculate checksum of ref 39045a80-0cb6-4bcb-bfad-481771f4054e::uoqa4qye9oy4ac86paqyglwvc: "/bin/Release/net9.0/publish": not found
  exit status 1
  

  Didn't get anywhere with docker.
• allan Posts: 64,729Questions: 1Answers: 10,709 Site admin

  2:08PM

  Managed to run it in the end.

  The issue is with the "Action" column - the button is being dynamically added after the DataTable is drawn. I'm not 100% sure what is adding it though. It looks like it might be part of the Volo Adp package?

  The issue is that since it is being added after the table is drawn, DataTables is calculating column widths with no data in that column. Then Adp (or whatever) is drawing it in resulting in increasing the column width, thus knocking everything out. The column widths are right up until the point that extra HTML is added.

  Ideally the HTML should be returned by the rendering function, but as I say, I don't really know how that is working - greping the code suggests it is in the Adp dlls, so I can't debug that further.

  A workaround, without changing how that action button is drawn is to use columns.contentPadding to insert something into the column for the width calculations. Adding contentPadding: 'mmmmmmm' just after the rowAction object appears to work okay for me.

  Allan