Responsive mode

  • Resolved urrangen

    (@urrangen)


    8 years, 8 months ago

    Hi, thanks for a great plugin

    I have 3 questions:

    1. In the collapse approach (responsive), how can I make the collapsable row have two columns?

    2. In the collapse approach (responsive), how can I make the row show at all times (remove the “+” and “-” button, so that all content always shows)

    3. In the collapse approach (responsive), how can I hide certain columns in mobile view?

    I will donate a sum if you can come up with solutions to these questions.

Viewing 1 replies (of 1 total)
  • Plugin Author Tobias Bäthge

    (@tobiasbg)

    8 years, 8 months ago

    Hi,

    thanks for your question, and sorry for the trouble.

    1. I’m not aware of a way to achieve that, sorry.

    2. This might be possible with the approach from https://datatables.net/extensions/responsive/examples/display-types/immediateShow.html
    To use that with the TablePress Extension, you would have to add

    "responsive": { "details": { "display": $.fn.dataTable.Responsive.display.childRowImmediate, type: "" } }

    to the “Custom Commands” text field on the table’s “Edit” screen.

    3. The best way to hide columns on small screens is using “Custom CSS”, for example using

    @media screen and (max-width: 768px) {
  .tablepress-id-123 .column-3,
  .tablepress-id-123 .column-7 {
    display: none;
  }
}

    This example would hide columns 3 and 7 of table 123 on screens that are smaller than 768px.

    Regards,
    Tobias

Viewing 1 replies (of 1 total)

The topic ‘Responsive mode’ is closed to new replies.