La representación de la tabla de datos JSF pierde el estilo CSS

Question

Tengo una tabla de datos que funciona como deseo cuando se procesa mediante un ciclo de solicitud/respuesta normal (no ajax).

Tengo un estilo definido que consiste en aplicar un color de fondo y relleno a la primera fila de la tabla:

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

Como mencioné anteriormente, el relleno y el color de fondo aparecen perfectamente cuando se cargan mediante la solicitud/respuesta típica.Sin embargo, hay un par de acciones que pueden hacer que esta tabla se vuelva a representar a través de AJAX.Cuando eso sucede, la tabla se recarga correctamente (son datos), pero el estilo anterior no se vuelve a aplicar.

Dado que no hay forma de asignar específicamente a la primera fila una clase CSS cuando se usa el componente dataTable.Entonces, utilicé el selector CSS anterior para obtener la primera fila.¿Alguien se ha enfrentado alguna vez a un problema como este?¿Mi única opción es intentar usar jQuery en el estado completo de TODOS... que pueden ser muchos lugares diferentes... acciones que pueden provocar que la tabla se vuelva a representar?

Mi problema es que estoy tratando de evitar el uso de un componente de tabla Richfaces por razones de velocidad y necesito que la tabla sea desplazable.Entonces, estoy usando una solución CSS específica del navegador para rastrear el cuerpo de la tabla y mantener los encabezados estáticos.El problema principal es que necesito que la primera fila de la tabla tenga un valor de relleno superior que la empuje hacia abajo por debajo de la ubicación fija del encabezado de la tabla.

Answer 1

Dado que está volviendo a ser volviendo a aplicar un estilo de datos, el estilo predeterminado de la tabla se aplica.

También debe volver a repender el código de estilo junto con el DataTable, que podría resolver su problema.

Pruebe algo como el código a continuación y Rerender OutputPanel en lugar de DataTable:

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