jQuery EasyUI Data Grid - Bedingungen Zeile Hintergrundfarbe
Dieses Tutorial zeigt Ihnen, wie Sie den Linienstil Data Grid (Datagrid) Montage zu ändern nach einer Reihe von Bedingungen. Wenn gelisteter Wert größer als 50 ist, werden wir eine andere Farbe für die Zeile gesetzt.
Entwickelt für die Datengitter (Datagrid) von rowStyler Funktion ist, damit Sie die Linienstile anpassen. Der folgende Code zeigt, wie Sie den Linienstil zu ändern:
<Table id = "tt" title = "Datagrid" style = "width: 600px; height: 250px" url = "data / datagrid_data.json" singleSelect = "true" fitColumns = "true"> <Thead> <Tr> <Th Feld = "itemid" width = "80"> Item ID </ th> <Th Feld = "productid" width = "80"> Product ID </ th> <Th Feld = "gelisteter" width = "80" align = "right"> Listenpreis </ th> <Th Feld = "Unitcost" width = "80" align = "right"> Kosten pro Einheit </ th> <Th Feld = "attr1" width = "150"> Attribut </ th> <Th field = "status" width = "60" align = "center"> Stauts </ th> </ Tr> </ Thead> </ Table>
$ ( '# Tt'). Datagrid ({ rowStyler: function (Index, Zeile) { if (row.listprice> 50) { return 'background-color: rosa; color: blue; font-weight: bold; " } } });
Wie Sie sehen können, haben wir die Hintergrundfarbe (Hintergrundfarbe), nach einigen Bedingungen für die rosa (pink), stellen Sie die Textfarbe blau (blau).