Рендеринг JSF dataTable теряет стиль CSS - PullRequest
Новая
       17

Рендеринг JSF dataTable теряет стиль CSS

0 голосов
/ 31 января 2011

У меня есть dataTable, который работает как нужно, когда он обрабатывается с помощью обычного (не ajax) цикла запрос / ответ.

У меня определен стиль, который заключается в применении цвета фона и отступов к самой первой строке таблицы: 

.myTable tr:first-child td {
  padding-top: 25px;
  background-color: yellow;
}

Как я упоминал выше, отступы и цвет фона выглядят идеально при загрузке через типичный запрос / ответ. Однако есть несколько действий, которые могут привести к повторной визуализации этой таблицы через AJAX. Когда это происходит, таблица корректно перезагружается (это данные), но вышеуказанный стиль не применяется повторно.

Поскольку при использовании компонента dataTable не существует способа специально назначить первой строке класс CSS. Итак, я использовал вышеупомянутый селектор CSS, чтобы получить первую строку. Кто-нибудь когда-либо имел дело с такой проблемой раньше? Является ли мой единственный вариант попробовать использовать jQuery в oncomplete ALL ... который может быть в разных местах ... действия, которые могут вызвать перерисовку таблицы?

Моя проблема в том, что я стараюсь не использовать компонент таблицы richfaces для скорости, и мне нужно, чтобы таблица была прокручиваемой. Итак, я использую решение CSS для браузера, чтобы srcoll тела таблицы и сохранить заголовки статичными. Основное зависание в том, что мне нужно, чтобы в первой строке таблицы было значение верхнего отступа, которое толкает его ниже фиксированного местоположения заголовка таблицы.

1 Ответ

2 голосов
/ 01 февраля 2011

Поскольку вы переопределяете только dataTable, применяется стиль таблицы по умолчанию.

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

Попробуйтечто-то вроде приведенного ниже кода и перерисовать outputPanel вместо dataTable: 

<a4j:outputPanel>
    <h:dataTable>
            //Data
    </h:dataTable>
    <style>
       .myTable tr:first-child td {
          padding-top: 25px;
          background-color: yellow;
        }
    </style>
</a4j:outputPanel>
...