jQuery EasyUI danych Siatka - format Kolumny

Poniższe przykłady są sformatowane w easyui danych kolumn DataGrid w środku, i użyć niestandardowego formatowania kolumny, jeśli cena jest niższa niż 20 tekst zmieni kolor na czerwony.

Aby sformatować kolumnę siatki danych (DataGrid), musimy ustawić atrybut formatyzatora, która jest funkcją. Funkcja formatowania zawiera trzy parametry:

• wartości: wartość odpowiedniego pola w aktualnym kolumny.
• wiersz: Bieżący wiersz danych jest rejestrowane.
• index: Bieżący indeks wiersza.

Tworzenie siatki danych (DataGrid)

	<Id Tabela = "tt" title = "Formatowanie kolumny" class = "easyui-DataGrid" style = "width: 550px; height: 250px"
			url = "data / datagrid_data.json"
			singleSelect = "true" iconCls = "icon-save">
		<THEAD>
			<Tr>
				<Pole Th = "itemid" width = "80"> Item ID </ th>
				<Pole Th = "productid" width = "80"> ID produktu </ th>
				<Th pole = "ListPrice" width = "80" align = "right" formatyzatora = "formatPrice"> Cennik </ th>
				<Pole Th = "unitcost" width = "80" align = "right"> jednostkowy koszt </ th>
				<Th pole = "attr1" width = "100"> Atrybut </ th>
				<Pole Th = "status" width = "60" align = "center"> Stauts </ th>
			</ Tr>
		</ THEAD>
	</ Table>

Należy pamiętać, że "ListPrice" pole ma "formatyzatora" atrybut, który wskazuje funkcje formatowania.

Napisz funkcje formatowania

	Funkcja formatPrice (val, wiersz) {
		if (val <20) {
			Zwrot "<span style =" color: red; "> ( '+ val +') </ span> ';
		} Else {
			powrót val;
		}
	}

Pobierz przykłady jQuery EasyUI

jeasyui-datagrid-datagrid7.zip