Проблема выравнивания столбцов с фиксированной таблицей данных заголовка

Я использую свойство фиксированного заголовка для таблицы угловых данных, и код выглядит следующим образом.

$scope.table.dataTable($scope.gridOpts);    
new $.fn.dataTable.FixedHeader($scope.table);

Заголовок таблицы фиксировался вверху страницы при прокрутке, и все работало нормально. Но я столкнулся с проблемой выравнивания столбцов между столбцами заголовков и столбцами тела таблицы данных.

Поэтому я попробовал решение, описанное в http://bobcravens.com/2010/01/html-scrolling-table-with-fixed-headers-jquery-plugin/, но результат остается прежним.

Я не мог понять, почему это происходит. Поэтому я дал некоторое время ожидания при вызове функции фиксированного заголовка new $.fn.dataTable.FixedHeader($scope.table);. Но результат снова остается прежним.

Любой орган сталкивался с той же проблемой?


datatable angularjs fixed-header-tables
person Saidh    schedule 28.11.2014    source источник

Ответы (1)


arrow_upward
0
arrow_downward

ОМГ, проблема простая. Функциональность фиксированного заголовка таблицы данных заключается в клонировании заголовка таблицы и добавлении его к телу. Но ловушка заключается в том, что классы, присвоенные заголовку исходной таблицы, не будут доступны в клонированной таблице, если стили определены ссылкой на какой-либо родительский класс. Таким образом, если мы задали некоторые размеры шрифта для заголовка таблицы, это не отразится в клонированном заголовке, и, следовательно, выравнивание столбцов будет нарушено!

person Saidh    schedule 02.12.2014
comment
вы нашли решение для этого? - person Parth Doshi; 24.02.2015
comment
что такое $scope.table? Можете ли вы опубликовать весь свой код в angular js? - person Parth Doshi; 24.02.2015
comment
$scope.table — это просто элемент DOM. - person Saidh; 25.02.2015
comment
Вы имеете в виду, что это идентификатор таблицы? Извините, но я вас не понял... не могли бы вы поделиться своим фрагментом кода для исправления заголовка таблицы, который работает для вас - person Parth Doshi; 25.02.2015
comment
$scope.table = angular.element(document.querySelector(#table-id)); $scope.table.dataTable(gridOpts); новый $.fn.dataTable.FixedHeader($scope.table); Надеюсь, это поможет вам.. - person Saidh; 26.02.2015
comment
Я получаю сообщение об ошибке gridOpts не определено .. не могли бы вы сказать мне, что такое gridOpts через код - person Parth Doshi; 26.02.2015