1. Home
  2. JQuery EasyUI Data Grid - Преобразование HTML сетки таблицы данных

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

JQuery EasyUI Data Grid - Преобразование HTML сетки таблицы данных

Этот пример демонстрирует, как преобразовать таблицу (таблица) для сетки данных (DataGrid).

Сетка (DataGrid) Информация столбца данных определяется в теге <THEAD>, данные определены в теге <TBODY>. Убедитесь в том, что все настройки имен полей данных столбцов, смотрите следующие примеры: 

	<Идентификатор таблицы = класс "тт" = "easyui-DataGrid" стиль = "ширина: 400px; высота: авто;">
		<THEAD>
			<Tr>
				<Th поле = "name1" ширина = "50"> Col ​​1 </ й>
				<Th поле = "имя2" ширина = "50"> Col ​​2 </ й>
				<Th поле = "name3" ширина = "50"> Col ​​3 </ й>
				<Th поле = "NAME4" ширина = "50"> Col ​​4 </ й>
				<Th поле = "name5" ширина = "50"> Col ​​5 </ й>
				<Th поле = "name6" ширина = "50"> Col ​​6 </ й>
			</ TR>                          
		</ THEAD>                           
		<TBODY>                            
			<Tr>                           
				<Td> Данные 1 </ TD>            
				<Td> Данные 2 </ TD>            
				<Td> Данные 3 </ TD>            
				<Td> Данные 4 </ TD>            
				<Td> Данные 5 </ TD>            
				<Td> Данные 6 </ TD>            
			</ TR>                          
			<Tr>                           
				<Td> Данные 1 </ TD>            
				<Td> Данные 2 </ TD>            
				<Td> Данные 3 </ TD>            
				<Td> Данные 4 </ TD>            
				<Td> Данные 5 </ TD>            
				<Td> Данные 6 </ TD>            
			</ TR>                          
			<Tr>                           
				<Td> Данные 1 </ TD>            
				<Td> Данные 2 </ TD>            
				<Td> Данные 3 </ TD>            
				<Td> Данные 4 </ TD>            
				<Td> Данные 5 </ TD>            
				<Td> Данные 6 </ TD>            
			</ TR>                          
			<Tr>                           
				<Td> Данные 1 </ TD>            
				<Td> Данные 2 </ TD>            
				<Td> Данные 3 </ TD>            
				<Td> Данные 4 </ TD>            
				<Td> Данные 5 </ TD>            
				<Td> Данные 6 </ TD>            
			</ TR>                          
		</ TBODY>                           
	</ Table>

Отлично, вы можете определить сложный заголовок таблицы, например: 

	<THEAD>
		<Tr>
			<Th поле = "name1" ширина = "50" RowSpan = "2"> Col ​​1 </ й>
			<Th поле = "имя2" ширина = "50" RowSpan = "2"> Col ​​2 </ й>
			<Th поле = "name3" ширина = "50" RowSpan = "2"> Col ​​3 </ й>
			<Th Colspan = "3"> Подробнее </ й>
		</ TR>
		<Tr>
			<Th поле = "NAME4" ширина = "50"> Col ​​4 </ й>
			<Th поле = "name5" ширина = "50"> Col ​​5 </ й>
			<Th поле = "name6" ширина = "50"> Col ​​6 </ й>
		</ TR>                          
	</ THEAD>

Теперь вы можете видеть, сложный заголовок был создан.

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

jeasyui-datagrid-datagrid1.zip

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

Contact US

JQuery EasyUI Data Grid - Преобразование HTML сетки таблицы данных
10/30