Heim > Web-Frontend > js-Tutorial > Über Jquery zTree Tree Control asynchrone Ladevorgänge

Über Jquery zTree Tree Control asynchrone Ladevorgänge

不言
Freigeben: 2018-06-25 09:47:37
Original
1912 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich der asynchrone Ladevorgang zur Baumsteuerung von Jquery zTree vorgestellt. Lernen Sie das asynchrone Laden von Jquery zTree zTree verwendet den Kerncode von JQuery, um eine Reihe von Tree-Plug-Ins zu implementieren, die die meisten gängigen Funktionen ausführen können

  • Kompatibel mit IE, Firefox, Chrome und anderen Browsern

  • Mehrere Bauminstanzen können gleichzeitig auf einer Seite generiert werden

  • Unterstützt JSON-Daten

  • Unterstützt einmalige statische Generierung und asynchrones Ajax-Laden

  • Unterstützt mehrere Ereignisantworten und Feedback

  • Unterstützt Verschieben, Bearbeiten und Löschen von Baumknoten

  • Unterstützt jede Änderung des Skins/personalisierten Symbols (basierend auf CSS)

  • Unterstützt äußerst flexible Kontrollkästchen- oder Radioauswahlfunktion

  • Einfache Parameterkonfiguration zur Erzielung flexibler Funktionen

Asynchrones Laden

Dies bedeutet: Wenn ein Baumknoten vorhanden ist Wenn zum Erweitern darauf geklickt wird, wird die Hintergrundaktion aufgefordert, die untergeordneten Knotendaten des angeklickten Knotens zurückzugeben und zu laden. Hier entwerfen wir hauptsächlich die asynchrone Attributeinstellung der Einstellungsvariablen von ztree:


var setting = {
 async: {
  enable: true,
  url:InitServiceIpsData.action,
  autoParam:[id, name],
  dataFilter: filter 
 },
Nach dem Login kopieren

Wenn Sie auf klicken, um den Baumknoten zu erweitern, Es wird angefordert, dass die durch die URL angegebene Aktion die Daten des untergeordneten Knotens abruft und diese dann an den Ztree bindet.

Beachten Sie, dass die Hintergrundaktion hier eine JSON-Zeichenfolge zurückgibt und ztree nur Arrays empfängt, wenn neue Knotendaten gebunden werden. Daher müssen Sie vor der Bindung die Filterfunktion verwenden, um Datenbereinigungs- und Konvertierungsvorgänge durchzuführen, um die Zeichenfolge in umzuwandeln ein Array. :


//过滤异步加载ztree时返回的数据 
 function filter(treeId, parentNode, childNodes) {
 if (!childNodes) 
  return null; 
 childNodes = eval((+childNodes+)); //必须转换为[{id:103,pId:1,name:'子节点3'}];这样的格式 
 return childNodes;
 }
Nach dem Login kopieren

Auf diese Weise wird beim Erweitern des Ztree-Baumknotens die Aktion zum Abrufen des untergeordneten Knotens angefordert Daten und gebunden.

Das Folgende ist eine Implementierung der Hintergrundaktion:


public String InitServiceIpsData()
 {
 HttpServletRequest request = ServletActionContext.getRequest();
 String id = request.getParameter(id);
 String name = request.getParameter(name);
 System.out.println(请求获取+name+的ip列表);
  
 List<hashmap<string,object>> list = new ArrayList<hashmap<string,object>>();  
 for(int i = 1; i <= 2; i++){ 
  HashMap<string,object> hm = new HashMap<string,object>();  
  hm.put(id, id + 0 + i);
  hm.put(pId, id);
  hm.put(name, name + _IP_ + i);
  hm.put(isParent, false);
  list.add(hm);
 } 
  
 JSONArray finalJson = JSONArray.fromObject(list);
 this.initServiceIpsData = finalJson.toString();
 return SUCCESS;
 }</string,object></string,object></hashmap<string,object></hashmap<string,object>
Nach dem Login kopieren

Das Obige ist der gesamte Inhalt dieses Artikels, ich hoffe es Wird für das Lernen aller nützlich sein. Bitte beachten Sie die chinesische PHP-Website für weitere verwandte Inhalte!

Verwandte Empfehlungen:

Das Problem der gemeinsamen Nutzung einer Komponente in Vue+Webpack (ausführliches Tutorial)


Wie es geht it in JavaScript Setter- und Getter-Methoden verwenden


Informationen zur Verwendung von Gojs-Komponenten in JS-Komponenten


Das obige ist der detaillierte Inhalt vonÜber Jquery zTree Tree Control asynchrone Ladevorgänge. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage