2009-04-20 22 views
6

¿Es posible en jqGrid (cuadrícula de jquery http://www.trirand.com/blog/) tener colores de texto de celda personalizados, p. en la columna de precios quiero rojo si el precio es> 100 $ y verde si el precio es < 50 $ ¿otro gris?jqGrid con colores de celda personalizados

Más generalmente hacer

  1. jqGrid proporciona ganchos para cambiar CellView rejilla, por ejemplo, Puedo registrar una devolución de llamada cuando se crean o modifican las celdas de la columna de precios.

  2. o es posible tener un modelo y vista separados (lado del cliente) p. desde el servidor puedo enviar dos datos para cada fila es decir, cómo mostrar y lo que desea mostrar

Editar: asi que aquí hay un ejemplo que muestra el formateador muestra, que los colores de la célula basa en el valor

function infractionInFormatter(el, cellval, opts) 
{ 
    $(el).html(cellval).css('color',infraction_color_map[cellval]); 
} 

colModel :[ 
    ... 
    {name:'date', index:'date', width:120, date:true}, 
    {name:'inf_out', index:'inf_out', width:60, formatter:infractionInFormatter,}, 
    ... 
], 

Respuesta

8

Sí, puedes hacer eso. Escribe un custom formatter. Esta es solo una función a la que hace referencia en su colModel. Obtiene una referencia al selector de celda final en la función, por lo que cualquier cosa que pueda hacer con jQuery lo puede hacer en un formateador. Incluyendo cambiar el color/estilo.

-1

Establecería un color de fondo rojo si una celda tiene valor xxx, sino un fondo verde si el valor es yyy.

he escrito este código:

..... 
colModel:[ 
    {name:'id',index:'id', width:15,hidden:true, align:"center"}, 
    {name:'title',index:'title', width:150, align:"center"}, 
    {name:'start',index:'start', width:350, align:"center", sorttype:"date"}, 
    {name:'fine',index:'fine', width:350, align:"center", sorttype:"date"}, 
    {name:'completed',index:'completed', width:120, align:"center",formatter:infractionInFormatter},   
    ], 
..... 

Y esta función al igual que su ejemplo:

function infractionInFormatter(el, cellval, opts) 
     { 
      ..... 
     } 

¿Cómo tengo que configurarlo?

Muchas gracias.

+1

Esta no es una respuesta en absoluto. Vaya [aquí] (http://stackoverflow.com/questions/ask) si desea hacer una pregunta. – FastTrack

2

También puede especificar la clase en el colModel:

colModel: [ 
      { 
      name:'field_x', 
      index:'field_x', 
      align: 'left', 
      width: 35, 
      classes: 'cvteste' 
      }, 
      ..... 
      ] 
Cuestiones relacionadas