Set same responsivePriority for more than one column

ladokjohan

Hello,

I have a table with 9 columns. It use responsive and bootstrap 4. I would like to use columns.responsivePriority in a way that two of the columns are hidden/shown together even if only one need to be hidden according to the available table width. How can this be done? I have tried to set target 6 and 7 to same priority (8), but it doesn't work - target 7 is still removed before target 6 instead of both together...

"columnDefs": [
    { responsivePriority: 1, targets: 0 },
    { responsivePriority: 2, targets: 8 },
    { responsivePriority: 3, targets: 1 },
    { responsivePriority: 4, targets: 2 },
    { responsivePriority: 5, targets: 3 },
    { responsivePriority: 6, targets: 4 },
    { responsivePriority: 7, targets: 5 },
    { responsivePriority: 8, targets: 6 },
    { responsivePriority: 8, targets: 7 }
],

colin

It appears to be working as expected for me here. Could you look at that, please, and see if it helps. If it's still not working for you, please can you update my example, or link to your page, so that we can see the problem.

Cheers,

Colin

ladokjohan

Thanks Colin for your answer.

Your code:

    { responsivePriority: 1, targets: 0 },
    { responsivePriority: 2, targets: 5 },
    { responsivePriority: 3, targets: 1 },
    { responsivePriority: 4, targets: 2 },
    { responsivePriority: 5, targets: 3 },
    { responsivePriority: 6, targets: 4 },

In your code you have different priority for all targets. That works fine. However, I want to set same priority for two columns so they are removed at the same time. I want target 6 & 7 to be hidden/shown at the same time, not only one of them.

colin

I see. It won't do that, it only makes space for the columns it needs - so once one column has been removed, there's no need to remove the other.

Colin