Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

206
Vistas
Column text color when row takes focus (is clicked)

I use jquery and jgrid for create a grid in php. I have modified the color of a column of my grid, using:

$grid[“loadComplete”] = "function(ids) { onloadFunction(ids)";

The onloadFunction function is as follows:

function onloadFunction(ids) {

   var ids = $(“#lstStudents”).jqGrid(‘getDataIDs’);

   for (var z=0;z<ids.length;z++) {

      var id=ids[z];

      $(“#lstStudents”).jqGrid(‘setCell’,id, ‘quarter1’,”, {‘background’:’rgb(250, 250, 250)’});
      $(“#lstStudents”).jqGrid(‘setCell’,id, ‘quarter1’,”, {‘color’:’rgb(0, 0, 0)’});

   }
}
When selecting a row, the column whose color I modified in the onLoadFunction function remains with the established color, that is, it does not take the defined color of a selected row. How would I make the modified column also have the background color and text color of the rest of the columns?

Image to clarify better: https://imgur.com/Uhr2sb3

Thank you very much for the help.

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

This is little bit tricky.

You know that the inline style (the style of the table cell) has higher priority than the css. Moreover the highlight class is added to the row while the custom class is added to the child table cell.

This mean that to solve the problem we need to redefine the cell class within the highlight class.

In your application do :

td.mycolor {        
    background:rgb(250, 250, 250);
    color : rgb(100, 200, 300);         
}

Add this class to the cell using the setCell method

$("#grid").jqGrid("setCell", rowid, "colname", "", "mycolor" );

Below the definition of mycolor class do:

.ui-widget-content .ui-state-highlight > td.mycolor { 
    background-color: inherit !important;
    color : inherit !important;
}

in case of Bootstrap this maybe should be

.table-success > td.mycolor { 
    background-color: inherit !important;
    color : inherit !important;
}

(check the docs to be a sure which class is added when the row is selected)

This way the mycolor will inherit the colors of the parent class when we add the class to the row.

about 4 years 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 vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda