jQuery EasyUI Data Grid - condiciones fila de establecer el color de fondo
Este tutorial le mostrará cómo cambiar el conjunto de estilo de línea Data Grid (cuadrícula de datos) de acuerdo con una serie de condiciones. Cuando el valor de Precio de la lista es mayor que 50, vamos a definir un color diferente para la fila.
Diseñado para la red de datos (cuadrícula de datos) de la función rowStyler es permitir personalizar los estilos de línea. El código siguiente muestra cómo cambiar el estilo de línea:
<Tabla id = "tt" title = estilo "DataGrid" = "width: 600px; altura: 250px" url = "data / datagrid_data.json" singleSelect = "true" fitColumns = "true"> <Culata en T> <Tr> <Campo Th = "Itemid" width = "80"> ID del elemento </ th> <Campo Th = "ProductID" width = "80"> Identificación del producto </ th> <Th Campo = "Precio de la lista" width = "80" align = "right"> Lista de Precios </ th> <Campo Th = "unitcost" width = "80" align = "right"> Costo unitario </ th> <= Th Campo anchura "attr1" = "150"> Atributo </ th> <Campo Th = "status" width = "60" align = "center"> Stauts </ th> </ Tr> </ Culata en T> </ Table>
$ ( '# Tt'). Datagrid ({ rowStyler: function (índice, fila) { si (row.listprice> 50) { retorno "background-color: rosa; color: blue; font-weight: bold;"; } } });
Como se puede ver, nos fijamos el background-color (color de fondo), de acuerdo con algunas modalidades de la rosa (rosa), establecemos el color del texto a azul (azul).