Answers

• Charley Posts: 66Questions: 17Answers: 0

  November 2018 edited November 2018

  https://jsfiddle.net/charleycartee/spjton6m/5/

  for 1: just shrink the page. as you shrink it, the plus sign appears in the first column. Once the first column vanishes, there's no plus sign

  Note: this doesn't necessarily happen in the /show version of the fiddle; you can't get the viewport down small enough

  for 2 shrink the page. Note that the search box header row doesn't get hidden as the table shrinks

  Note that once column 1 vanishes, it's footer row DOES.
  Use column visibility, note that the search boxes vanish with their columns

  for 3: I think that this one is an artifact of 2, which prevented me from getting the viewport small enough to force it to hide some columns.

  for 4
  while file size, click PD&E, note popover. Click again to dismiss
  shrink page until phase disappears
  click plus sign
  click PD&E
  Note no popover appears
• colin Posts: 15,142Questions: 1Answers: 2,586

  November 2018

  Hi @Charley ,

  1. If the first column may be hidden, you would want to put that plus sign into its own column, as in this example

  2. I reproduce this with a simpler setup

  I/we will get back to you about the others ones!

  Cheers,

  Colin
• allan Posts: 61,650Questions: 1Answers: 10,094 Site admin

  November 2018

  Yes, 1 is a bug for certain. It uses display:none to hide the responsive columns, but that means they are still in the DOM. The Responsive CSS uses :first-child by default, which means that the responsive control is hidden in this situation. There isn't a 'first visible child' selector as far as I am aware, so the workaround at the moment is to use a dedicated column as Colin suggested like in this example.

  2 - A limitation I'm afraid. Responsive 2 does not currently cope with multi-row headers. That is something that I will be addressing in future.

  3 - Yup. That's a knock on from 2 I think.

  4 - By default Responsive will copy the original elements from the cells rather than reusing them and moving them around the DOM. While easier and more performant, that has the disadvantage of events not being carried over. You could try using the experimental listHiddenNodes renderer which does more the elements around. I call it "experimental" as it hasn't been widely used in production yet.

  Allan
• Charley Posts: 66Questions: 17Answers: 0

  December 2018

  any particular reason you use display:none rather than a class that has display:none?

  The latter should be addressable vs css (you can, in theory, use a css selector on the style tag but thats incredibly fragile).

  The example shows the plus and some hidden fields all of the time; is that just because of the size of that particular table?

  re2: do you know what sort of timeline you mean by "in future" … I have tables in production now with that issue, so I need to know whether I need to look into addressing it myself

  re4: I may take a look at that but I've at least temporarily addressed it by forcing it to never hide that column.
• allan Posts: 61,650Questions: 1Answers: 10,094 Site admin

  December 2018

  any particular reason you use display:none rather than a class that has display:none?

  The primary reason was to reduce dependency on the Responsive CSS being loaded. This way it works without the default CSS file. That said, I would be open to changing that if it would resolve this issue, but I'm not certain that it would. There isn't a 'first without this class' selector (happy to be wrong there!).

  The example shows the plus and some hidden fields all of the time; is that just because of the size of that particular table?

  Correct. Also the container for the table has a max-width restricting its size so it is always effectively in responsive mode there.

  re2: do you know what sort of timeline you mean by "in future"

  Its not currently on my development chart I'm afraid. I've made changes in the dev branch for DataTables 2 which will help support this, but I can't realistically see that being released within the next six months (loads still to do there).

  Allan
• Charley Posts: 66Questions: 17Answers: 0

  January 2019

  https://stackoverflow.com/questions/25166234/css-first-child-without-certain-class

  Boltclock's answer here might be relevant, haven't dug into it. I might play around with it