Как скрыть колонку в таблице, не удаляя
Как скрыть колонку в таблице, не удаляя ее из DOM-структуры ?
Например, рисуется таблица, после получения данных от сервера, затем указанный столбец или несколько в разных местах таблицы (не обязательно по порядку) - скрывается, а все остальные сдвигаются, к тому месту откуда был удален столбец. И в конечном итоге клиент видит таблицу и не подозревает, что один или несколько отсутствует. Но в DOM-дереве, эти столбцы должны остаться каждый на своем месте, чтобы при парсинге данных ячеек, объект JSON был правильно составлен, каждое поле с данными было на своем месте, иначе сервер не примет данные , так как там будут отсуствовать скрытые поля. такая ситуация происходит при применении плагина DataTables columnDefsForDataTables: [ {targets: [2], visible: false}, /*скрыть указанный столбец*/ столбец скрывается и невидим не только клиенту, но и исчезает из DOM-структуры документа. Как можно исправить ситуацию ? |
Можно присвоить свойство display: none;
|
Russo,
мысль верная, но можно код? |
Я, с этим плагином не знаком. В опциях ищите присвоение класса колонкам. А в css создаете класс со свойством display: none;
|
из скрипта который задает настройки для плагина
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: "" - не воспринимается плагином Вопрос решен, почти. Если таблица работает в постраничном режиме, тогда при переходе на другую страницу, ячейки съезжают с данными. То есть ячейка скрытая на первой странице, на следующей странице появляется под другой колонкой. |
решается так
selectorTableForDataTables = $(selectorTable).DataTable({...}) После привязки плагина к таблице, получим контекст таблицы, под управлением данного плагина (если неправильно комментирую поправьте). Данный контекст имеет свою область действия, если назначать свои стили или события напрямую к селекторам элементов, то при листании страниц таблицы ничего не заработает. Затем из этого контекста получаем селектор applyStyle(table.$('.classVisible'),{ 'display': 'none' }); Правда не все проблемы можно решить через контекст, у меня не получилось. Заголовок таблицы не исчезает, соответственно все это бесполезно. |
Цитата:
|
Цитата:
можно, просто у меня этот метод используется для массива стилей, так почему не использовать раз он есть |
Цитата:
Цитата:
|
Часовой пояс GMT +3, время: 04:28. |