Il miglior tutorial jQuery EasyUI menu ad albero - menu ad albero aggiungere genitore / nodi figlio Nel 2024, in questo tutorial puoi imparare Scarica esempi jQuery EasyUI,

jQuery EasyUI menu ad albero - menu ad albero aggiungere genitore / nodi figlio

Solitamente rappresenta un nodo albero è in ogni modo un nodo memorizza un parentid. Questo è anche chiamato lista di adiacenza del modello. carico diretto dei dati nel menu ad albero (Tree) non è consentito. Ma possiamo, prima struttura del menu di carico, metterlo in un formato di dati standard di menu ad albero standard (albero). Albero (Tree) plug-in fornisce l'opzione di un 'loadFilter' a funzionare, si può ottenere questa funzionalità. Esso offre la possibilità di modificare le dati in arrivo. Questo tutorial mostra come utilizzare la funzione genitore 'loadFilter' per caricare il nodo / bambino al menù ad albero (Tree).

Dati nodo / bambino Parent

	[
	{ "Id": 1, "parendId": 0, "name": "alimenti"},
	{ "Id": 2, "parentId": 1, "name": "frutti"},
	{ "Id": 3, "parentId": 1, "name": "verdure"},
	{ "Id": 4, "parentId": 2, "name": "mela"},
	{ "Id": 5, "parentId": 2, "name": "orange"},
	{ "Id": 6, "parentId": 3, "name": "pomodoro"},
	{ "Id": 7, "parentId": 3, "name": "carota"},
	{ "Id": 8, "parentId": 3, "name": "cavolo"},
	{ "Id": 9, "parentId": 3, "name": "patata"},
	{ "Id": 10, "parentId": 3, "name": "lattuga"}
	]

Usa 'loadFilter' Create menu ad albero (Tree)

	$ ( '# Tt'). Albero ({
		URL: 'dati / tree6_data.json',
		loadFilter: funzione (file) {
			tornare convertire (righe);
		}
	});

Realizzazione di conversione

	funzione di conversione (file) {
		esiste la funzione (righe, ParentID) {
			for (var i = 0; i <rows.length; i ++) {
				if (righe [i] == .ID parentId) return true;
			}
			return false;
		}
		
		nodi var = [];
		// I nodi di livello superiore
		for (var i = 0; i <rows.length; i ++) {
			fila var = righe [i];
			if (! esiste (righe, row.parentId)) {
				nodes.push ({
					id: row.id,
					Testo: row.name
				});
			}
		}
		
		var TODO = [];
		for (var i = 0; i <nodes.length; i ++) {
			toDo.push (nodi [i]);
		}
		while (toDo.length) {
			var = node toDo.shift (); // il nodo padre
			// Ottenere i nodi figli
			for (var i = 0; i <rows.length; i ++) {
				fila var = righe [i];
				if (row.parentId == node.id) {
					var bambino = {id: row.id, testo: row.name};
					if (node.children) {
						node.children.push (bambino);
					} Else {
						node.children = [bambino];
					}
					toDo.push (bambino);
				}
			}
		}
		tornare nodi;
	}

Scarica esempi jQuery EasyUI

jeasyui-tree-tree6.zip

jQuery EasyUI menu ad albero - menu ad albero aggiungere genitore / nodi figlio
10/30