jQuery EasyUI drzewa menu - menu Tree Dodaj Rodzic / węzły potomne
Zwykle oznacza węzeł drzewa jest w każdym calu węzeł przechowuje parentId. To jest także nazywany sąsiedztwa lista modelu. Bezpośredni ładowania danych do drzewa menu (drzewo) jest niedozwolone. Ale możemy przed menu załadunku drzewa, umieścić go do standardowego menu standardowe drzewa (tree) formatu danych. Drzewo (Tree) plug-in zapewnia opcję 'A' loadFilter funkcjonować, może osiągnąć taką funkcjonalność. To stwarza okazję do zmiany jakichkolwiek danych przychodzących. Ten poradnik pokazuje, jak korzystać z funkcji rodzica loadFilter 'załadować węzeł / dziecko do menu drzewa (drzewo).
Rodzic / dziecko Dane węzła
[
{ "Id": 1, "parendId": 0 "name": "przekąski"},
{ "Id": 2 "parentId": 1, "name": "Owoce"},
{ "Id": 3 "parentId": 1, "name": "Warzywa"},
{ "Id": 4, "parentId": 2, "name": "jabłko"},
{ "Id": 5, "parentId": 2, "name": "pomarańczowa"},
{ "Id": 6 "parentId": 3, "name": "pomidor"},
{ "Id": 7 "parentId": 3, "name": "marchewka"},
{ "Id": 8 "parentId": 3, "name": "Kapusta"},
{ "Id": 9 "parentId": 3, "name": "ziemniak"},
{ "Id": 10, "parentId": 3, "name": "sałata"}
]
Stosowanie "loadFilter 'Tworzenie drzewa menu (drzewo)
$ ( '# Tt "). Drzewo ({
url: "dane / tree6_data.json"
loadFilter: funkcyjne (wiersze) {
powrót zagospodarowania (wiersze);
}
});
Realizacja konwersji
Funkcja konwersji (wiersze) {
funkcja istnieje (wiersze, parentId) {
for (var i = 0; i <rows.length; i ++) {
if (wiersze [i] == .id parentId) return true;
}
return false;
}
węzły var = [];
// Pobierz z najlepszymi na poziomie węzłów
for (var i = 0; i <rows.length; i ++) {
var row = wiersze [i];
if (! istnieje (wiersze, row.parentId)) {
nodes.push ({
id: row.id,
Tekst: row.name
});
}
}
var todo = [];
for (var i = 0; i <nodes.length; i ++) {
toDo.push (węzły [i]);
}
while (toDo.length) {
var node = toDo.shift (); // węzeł nadrzędny
// Get the Children węzłów
for (var i = 0; i <rows.length; i ++) {
var row = wiersze [i];
if (row.parentId == node.id) {
var dziecko = {id: row.id, tekst: row.name};
if () {node.children
node.children.push (dziecko);
} Else {
node.children = [dziecko];
}
toDo.push (dziecko);
}
}
}
powrót węzły;
}