1. Home
  2. Jquery EasyUI Data Grid - Формат Столбцы

Лучшее руководство по Jquery EasyUI Data Grid - Формат Столбцы в 2024 году. В этом руководстве вы можете изучить Скачать примеры Jquery EasyUI,

Jquery EasyUI Data Grid - Формат Столбцы

Следующие примеры представлены в формате данных easyui столбцов DataGrid внутри, и использовать специальный столбец форматировщик, если цена будет меньше, чем 20 текст станет красным.

Для форматирования столбца сетки данных (DataGrid), нам нужно установить атрибут форматтера, который является функцией. Функция форматирования содержит три параметра:

  • Значение: значение соответствующего поля в текущем столбце.
  • строка: Текущие данные строки записывается.
  • Индекс: Текущий номер строки.

Создание сетки данных (DataGrid) 

	<Таблица ID = "тт" название = "Форматирование столбцов" класс = "easyui-DataGrid" стиль = "ширина: 550px; высота: 250px"
			URL = "Данные / datagrid_data.json"
			singleSelect = "истинные" iconCls = "значок-сохранить">
		<THEAD>
			<Tr>
				<Th поле = "ItemId" ширина = "80"> Item ID </ й>
				<Th поле = "ProductID" ширина = "80"> Идентификатор продукта </ й>
				<Th поле = "Коек Стоимость" ширина = "80" выровняйте = "правильный" форматтера = "formatPrice"> Цены </ й>
				<Th поле = "unitcost" ширина = "80" выровняйте = "право"> себестоимость единицы продукции </ й>
				<Th поле = "attr1" ширина = "100"> Атрибут </ й>
				<Th = поле "статус" ширина = "60" выровняйте = "центр"> Stauts </ е>
			</ TR>
		</ THEAD>
	</ Table>

Обратите внимание, что поле 'Коек Стоимость' имеет атрибут 'форматтера', который указывает функции форматирования.

Написать функции форматирования 

	Функция formatPrice (Вэл, строка) {
		если (значение <20) {
			Возвращение '<SPAN стиль = "цвет: красный;"> (+ Вэл +') </ SPAN> ';
		} Else {
			вернуться Val;
		}
	}

Скачать примеры Jquery EasyUI

jeasyui-datagrid-datagrid7.zip

Горячие учебники

Contact US

Jquery EasyUI Data Grid - Формат Столбцы
10/30