Как скрыть колонку в таблице, не удаляя

[alex-romanov]

Как скрыть колонку в таблице, не удаляя ее из DOM-структуры ?

Например, рисуется таблица, после получения данных от сервера,
затем указанный столбец или несколько в разных местах таблицы (не обязательно по порядку) - скрывается, а все остальные сдвигаются, к тому месту откуда был удален столбец. И в конечном итоге клиент видит таблицу и не подозревает, что один или несколько отсутствует.

Но в DOM-дереве, эти столбцы должны остаться каждый на своем месте,
чтобы при парсинге данных ячеек, объект JSON был правильно составлен, каждое поле с данными было на своем месте,
иначе сервер не примет данные , так как там будут отсуствовать скрытые поля.

такая ситуация происходит при применении плагина DataTables

columnDefsForDataTables: [
            {targets: [2], visible: false}, /*скрыть указанный столбец*/

столбец скрывается и невидим не только клиенту, но и исчезает из DOM-структуры документа.

Как можно исправить ситуацию ?

[Russo]

Можно присвоить свойство display: none;

[рони]

Russo,
мысль верная, но можно код?

[Russo]

Я, с этим плагином не знаком. В опциях ищите присвоение класса колонкам. А в css создаете класс со свойством display: none;

[alex-romanov]

из скрипта который задает настройки для плагина

columnDefsForDataTables: [
            {targets: [2], className: "classVisible"}, /*скрыть указанный столбец*/
            {targets: [6], width: '10px', class: 'tdControl'},
            {targets: [7], width: '10px', class: 'tdControl'},
            {targets: [8], width: '30px', class: 'tdControl'}
        ],

затем назначаю стиль

applyStyle('.classVisible',{
                'display': 'none'
            });
  /*Применение стиля*/
        function applyStyle(selector, style) {
            $(selector).css(style);
        }

работает только такая опция

className: ""

class: "" - не воспринимается плагином

Вопрос решен, почти.
Если таблица работает в постраничном режиме, тогда при переходе на другую страницу, ячейки съезжают с данными.
То есть ячейка скрытая на первой странице, на следующей странице появляется под другой колонкой.

[alex-romanov]

решается так

selectorTableForDataTables = $(selectorTable).DataTable({...})

После привязки плагина к таблице, получим контекст таблицы, под управлением данного плагина (если неправильно комментирую поправьте).
Данный контекст имеет свою область действия, если назначать свои стили или события напрямую к селекторам элементов, то при листании страниц таблицы ничего не заработает.

Затем из этого контекста получаем селектор

applyStyle(table.$('.classVisible'),{
                'display': 'none'
            });

Правда не все проблемы можно решить через контекст, у меня не получилось.

Заголовок таблицы не исчезает, соответственно все это бесполезно.

[рони]

затем назначаю стиль

а нельзя просто css добавить, без всяких applyStyle

[alex-romanov]

а нельзя просто css добавить, без всяких applyStyle

можно, просто у меня этот метод используется для массива стилей, так почему не использовать раз он есть

[рони]

так почему не использовать

то при листании страниц таблицы ничего не заработает.