jQuery EasyUI Data Grid - Formato colonne
Gli esempi che seguono sono formattati in dati di colonna DataGrid easyui dentro, e l'uso della colonna di formattazione personalizzata, se il prezzo è inferiore a 20 testo diventa rosso.
Per formattare una colonna di griglia di dati (DataGrid), abbiamo bisogno di impostare l'attributo di formattazione, che è una funzione. La funzione di formattazione contiene tre parametri:
- Valore: il valore del campo corrispondente nella colonna corrente.
- fila: I dati riga corrente viene registrato.
- Indice: L'indice di riga corrente.
La creazione di una griglia di dati (DataGrid)
<Table id = titolo "tt" = "Colonne di formattazione" class = stile "easyui-DataGrid" = "width: 550px; height: 250px" url = "dati / datagrid_data.json" singleSelect = "true" iconCls = "icona-save"> <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" formattatore = "formatprice"> Listino </ th> <Field Th = "Costounitario" width = "80" align = "right"> Costo Unità </ th> <Th campo = larghezza "attr1" = "100"> attributo </ th> <Field Th = "status" width = "60" align = "center"> Stauts </ th> </ Tr> </ Thead> </ Table>
Si prega di notare che, il campo 'Prezzo di listino' ha un attributo 'formattatore', che indica le funzioni di formattazione.
Scrivi funzioni di formattazione
Funzione formatprice (val, riga) { if (val <20) { ritorno '<span style = "color: red;"> (' + val + ') </ span>'; } Else { tornare val; } }