Support » Plugin: TablePress » Change column Visibility for each table in collapse

Viewing 15 replies - 1 through 15 (of 15 total)
  • Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble.

    Just to make sure that I understand: Do you want certain columns to always be collapsed? For that, you can add this to the “Custom Commands” text field on the table’s “Edit” screen:

    "columnDefs": [ { "className": "none", "targets": [ 5, 6, 7, 8, 9 ] } ]
    

    This would always collapse columns 6 through 10 in a 10-column table (counting the columns starts with 0).

    Regards,
    Tobias

    Thread Starter righren

    (@righren)

    Thank you for your response!

    I tried to add this cord to the “Custom Commands” , but it has’nt changed since I add [responsive=collapse responsive_breakpoint=”phone”] to shortcord.
    Does “className” mean “additional CSS”, right?

    Can you think of anything that might have caused it?

    And then, if I wanna display only one column to one row, should I add CSS like “min-width”?

    I’m sorry for asking a lot of question, and my English is so bad.

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    no, this has nothing to do with “Additional CSS”, only the “Custom Command” is needed.

    Can you please post a link to the page with the table where this problem happens, so that I can take a direct look? Thanks!

    Regards,
    Tobias

    Thread Starter righren

    (@righren)

    Thank you for your response.

    I understood, I thought “ClassName” was “Additional CSS Class”.
    Table has changed by adding cord directly.

    This plugin is excellent, It far exceeded my expectations!

    Thank you!

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    no problem, you are very welcome! 🙂 Good to hear that this helped!

    Best wishes,
    Tobias
     
    P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!

    Thread Starter righren

    (@righren)

    Sorry, I have one more question.

    Is there a way to change display in the case of PC or mobile?

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    I’m not sure what you mean. For possible options for responsiveness, if you mean that, please see https://tablepress.org/extensions/responsive-tables/

    Regards,
    Tobias

    Thread Starter righren

    (@righren)

    Thank you.
    I’m sorry I didn’t make it clear enough.

    I know that, I have added shortcord [table id=123 responsive=collapse responsive_breakpoint=”phone” /].

    But having added cord “columnDefs”: [ { “className”: “none”, “targets”: [ 5, 6, 7, 8, 9 ] } ], it haven’t change that table in the case of PC or mobile.

    I wanna change display of collapse table in the case of PC or mobile.

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    Can you please post a link to the page with the table where this problem happens, so that I can take a direct look? Thanks!

    Regards,
    Tobias

    Thread Starter righren

    (@righren)

    I’m sorry to ask you so many times.

    https://games-one.net/pokemon/swsh/0888_f01/

    Example, table id=4.
    It displays 7 columns on PC and mobile now, then I wanna change 5 columns only on mobile.

    Thank you!

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    ok, you will need a different className then, according to the documentation at https://datatables.net/extensions/responsive/classes

    Please try this “Custom Command” then:

    "columnDefs": [ { "className": "not-mobile", "targets": [ 5, 6, 7, 8, 9 ] } ]
    

    Regards,
    Tobias

    Thread Starter righren

    (@righren)

    Thnak you.

    I have tried to add this cord, collapse table on mobile have changed 5 columns.
    But I have wanted keep 7 columns on PC, I have added first cord, then display on mobile have got corrupted.

    【Current command】
    “columnDefs”: [ { “className”: “not-mobile”, “targets”: [ 5, 6, 7, 8, 9 ] } ],”columnDefs”: [ { “className”: “none”, “targets”: [ 7, 8, 9 ] } ]

    When I wanna diplay 【PC: 7 col, Mobile: 5 col】, What should I input?

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    please put only

    "columnDefs": [ { "className": "not-mobile", "targets": [ 5, 6, 7, 8, 9 ] } ]
    

    There will not be a guarantee that the browser can show the columns like that on PC and mobile, however. This is all defined by the column widths, and also influenced by the fact that your table is shown in a collapsable section, which makes width calculations difficult.

    Regards,
    Tobias

    Thread Starter righren

    (@righren)

    I understand.
    As I thought, Table is difficult.

    Thank you for your quick and polite response.

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    sure, no problem! Always happy to help!

    Best wishes,
    Tobias

Viewing 15 replies - 1 through 15 (of 15 total)
  • You must be logged in to reply to this topic.