jQuery EasyUI Data Grid - condizioni colore di sfondo impostato fila
Questo tutorial vi mostrerà come cambiare il gruppo Stile linea Data Grid (DataGrid) in base ad una serie di condizioni. Quando il valore prezzo di listino è maggiore di 50, verrà impostare un colore diverso per la riga.
Progettato per griglia di dati (DataGrid) della funzione rowStyler è quello di permettere di personalizzare gli stili di linea. Il codice seguente mostra come modificare lo stile della linea:
<Table id = titolo "tt" = stile "DataGrid" = "width: 600px; height: 250px" url = "dati / datagrid_data.json" singleSelect = "true" fitColumns = "true"> <Thead> <Tr> <Field Th = "Itemid" width = "80"> ID Articolo </ th> <Field Th = larghezza "ProductID" = "80"> ID prodotto </ th> <Th campo = larghezza "prezzo di listino" = "80" align = "right"> Listino </ th> <Field Th = "Costounitario" width = "80" align = "right"> Costo Unità </ th> <Th campo = larghezza "attr1" = "150"> attributo </ th> <Field Th = "status" width = "60" align = "center"> Stauts </ th> </ Tr> </ Thead> </ Table>
$ ( '# Tt'). DataGrid ({ rowStyler: la funzione (indice, riga) { if (row.listprice> 50) { ritorno 'background-color: rosa; color: blue; font-weight: bold;'; } } });
Come potete vedere, abbiamo impostato il background-color (colore di sfondo), secondo alcune condizioni per la rosa (rosa), impostare il colore del testo al blu (blu).