Company logo
  • Empleos
  • Bootcamp
  • Acerca de nosotros
  • Para profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
    • Bootcamp
  • Para empresas
    • Inicio
    • Nuestro proceso
    • Planes
    • Pruebas
    • Nómina
    • Blog
    • Calculadora

0

47
Vistas
How to apply the same row color when the row is expanded for a table

Hi I have an issue please help me to fix it

7 months ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Since your background coloring will NOT depend on the even/odd index information, you should simply use another approach for the styling.

What I would do personally is use CSS classes to identify the initial even/odd rows and when a row get extended give its children the same class.

You didnt share the 'expand' code so I do not really know how you could do that but something like that:

<tr
  key={i}
  className={`Itable-row-default table-row-${i} ${i%2 === 0 ? 'table-white' : 'table-grey'}` }
>
  <td colspan={columnData.length + 1}>
    {dataExpand[i]}
  </td>
</tr>

And the associated css

tr {
  &.table-gray {
    background: gray;
  }
  &.table-white {
    background: white;
  }

}

Depending on the 'onExpandHandler' method & the format of your initial model this might need some adaptations though :)

(oh and you should favor screenshots for images :p)

7 months ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar empleo Planes Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2023 PeakU Inc. All Rights Reserved.