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

Дерево меню JQuery EasyUI - дерево, чтобы добавить страницу сетку

Этот учебник покажет вам, как загрузить динамические характеристики дерева с сеткой (TreeGrid) была добавлена ​​вкладка.

Создание дерева сетки (TreeGrid)

Включить дерево сетки (TreeGrid) Функция вызова, необходимо добавить 'нумерацию страниц: истинный' атрибут будет послан 'страницу' и аргумент 'строк' на сервер, чтобы при загрузке страницы.

	<Таблица название = "Продукты" класс = "easyui-TreeGrid" стиль = "ширина: 700px; высота: 300px"
			Данные опции-= "
				URL: 'treegrid4_getdata.php',
				rownumbers: правда,
				нумерацией страниц: правда,
				PAGESIZE: 2,
				PageList: [2,10,20],
				idField: 'ID',
				treeField: 'имя',
				onBeforeLoad: функция (строка, парам) {
					если (! строк) {// нагрузочных строк верхнего уровня
						param.id = 0; // Set ID = 0, указывают загружать новые строки страницы
					}
				}
			">
		<THEAD>
			<Tr>
				<Th поле = "имя" ширина = "250"> Имя </ й>
				<Th поле = "количество" ширина = "100" присоединяются = "право"> Количество </ е>
				<Th поле = "цена" ширина = "150" присоединяются = "правильный" форматировщик = "formatDollar"> Цена </ й>
				<Th поле = "общая" ширина = "150" присоединяются = "правильный" форматировщик = "formatDollar"> Общее </ е>
			</ TR>
		</ THEAD>
	</ Table>

Код на стороне сервера

treegrid4_getdata.php

? $ Page = Исеть ($ _ POST [ 'страница']) intval ($ _ POST [ 'страница']): 1;
? $ Ряды = Исеть ($ _ POST [ 'строки']) intval ($ _ POST [ 'строки']): 10;
$ Offset = ($ стр-1) * $ строк;

$ Id = Исеть ($ _ POST [ 'ID']) intval ($ _ POST [ 'ID']): 0 ;?

включают 'conn.php';

$ Результат = массив ();
если ($ ID == 0) {
	$ Rs = mysql_query ( "SELECT COUNT (*) из продуктов, где ParentID = 0");
	$ Row = mysql_fetch_row ($ RS);
	$ Результат [ "всего"] = $ строки [0];
	
	$ Rs = mysql_query ( "выберите * из продуктов, где ParentID = 0 предел $ офсет, $ строк");
	$ = Items массив ();
	в то время как ($ строка = mysql_fetch_array ($ RS)) {
		? $ Row [ 'состояние'] = has_child ($ строки [ 'ID']) 'закрыто': 'открыто';
		array_push ($ элементов, $ строка);
	}
	$ Результат [ "строки"] = $ элементов;
} Else {
	$ Rs = mysql_query ( "выберите * из продуктов, где ParentID = $ ID");
	в то время как ($ строка = mysql_fetch_array ($ RS)) {
		? $ Row [ 'состояние'] = has_child ($ строки [ 'ID']) 'закрыто': 'открыто';
		$ Row [ 'общая'] = $ строки [ 'цена'] * $ строки [ 'количество'];
		array_push ($ результат, $ строка);
	}
}

эхо json_encode ($ результат);

Функция has_child ($ ID) {
	$ Rs = mysql_query ( "SELECT COUNT (*) из продуктов, где ParentID = $ ID");
	$ Row = mysql_fetch_array ($ RS);
	вернуть $ строки [0]> 0 верно :? ложь;
}

Направлено параметры сервера включают в себя:

  • страница: текущая страница для загрузки.
  • строки: размер страницы.
  • ID: идентификатор родительского значения строки, возвращенной от сервера собирается быть добавлены.

Когда вы расширяете строку узла, 'идентификатор' значение больше 0. При изменении темы, значение 'ID' должен быть установлен в 0, чтобы поместить груз дочерние строки.

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

jeasyui-tree-treegrid4.zip

Дерево меню JQuery EasyUI - дерево, чтобы добавить страницу сетку
10/30