1. Heim
  2. jQuery EasyUI Baum Menü - Baum Menü hinzufügen Eltern / Kind-Knoten

Das beste jQuery EasyUI Baum Menü - Baum Menü hinzufügen Eltern / Kind-Knoten-Tutorial im Jahr 2024. In diesem Tutorial können Sie Download von jQuery EasyUI Beispiele, lernen

jQuery EasyUI Baum Menü - Baum Menü hinzufügen Eltern / Kind-Knoten

Normalerweise stellt es ein Baumknoten ist in jeder Hinsicht ein Knoten eine parentid speichert. Dies wird auch Adjazenzliste Modell genannt. Direkt laden die Daten in den Menübaum (Baum) ist nicht erlaubt. Aber wir können vor dem Laden Menübaum, steckte es in eine Standard-Standard-Menübaum (Baum) Datenformat. Baum (Baum) Plug-in bietet eine "loadFilter 'Option funktionieren kann, um diese Funktionalität erreichen können. Es bietet die Möglichkeit, einen der eintreffenden Daten zu ändern. Dieses Tutorial zeigt Ihnen, wie 'loadFilter "Eltern-Funktion verwenden zu laden / Kind-Knoten Baummenü (Baum).

Eltern / Kind-Knotendaten 

	[
	{ "Id": 1, "parendId": 0, "name": "Lebensmittel"},
	{ "Id": 2, "parentId": 1, "name": "Fruits"},
	{ "Id": 3, "parentId": 1, "name": "Gemüse"},
	{ "Id": 4, "parentId": 2, "name": "apple"},
	{ "Id": 5, "parentId": 2, "name": "orange"},
	{ "Id": 6, "parentId": 3, "name": "Tomate"},
	{ "Id": 7, "parentId": 3, "name": "Karotte"},
	{ "Id": 8, "parentId": 3, "name": "Kohl"},
	{ "Id": 9, "parentId": 3, "name": "Kartoffel"},
	{ "Id": 10, "parentId": 3, "name": "Salat"}
	]

Verwenden Sie 'loadFilter' Create Menübaum (Baum) 

	$ ( '# Tt'). Baum ({
		url: 'data / tree6_data.json',
		loadFilter: function (Zeilen) {
			Rückkehr convert (Zeilen);
		}
	});

Realisierung von Conversion 

	Funktion convert (Zeilen) {
		Funktion existiert (Zeilen, parentId) {
			for (var i = 0; i <rows.length; i ++) {
				if (Zeilen [i] .id == parentId) return true;
			}
			return false;
		}
		
		var nodes = [];
		// Holen Sie sich die Top-Level-Knoten
		for (var i = 0; i <rows.length; i ++) {
			var row = Zeilen [i];
			if (! vorhanden ist (Zeilen, row.parentId)) {
				nodes.push ({
					ID: row.id,
					Text: row.name
				});
			}
		}
		
		var todo = [];
		for (var i = 0; i <nodes.length; i ++) {
			toDo.push (Knoten [i]);
		}
		während (toDo.length) {
			var node = toDo.shift (); // der übergeordnete Knoten
			// Holen Sie sich die Kinderknoten
			for (var i = 0; i <rows.length; i ++) {
				var row = Zeilen [i];
				if (row.parentId == node.id) {
					var child = {id: row.id, Text: row.name};
					if (node.children) {
						node.children.push (Kind);
					} Else {
						node.children = [Kind];
					}
					toDo.push (Kind);
				}
			}
		}
		Rückkehr Knoten;
	}

Download von jQuery EasyUI Beispiele

jeasyui-tree-tree6.zip

Hot Tutorials

Kontaktiere uns

jQuery EasyUI Baum Menü - Baum Menü hinzufügen Eltern / Kind-Knoten
10/30