jQuery EasyUI menú de árbol - Árbol de menú para agregar un nodo
En este tutorial se muestra cómo conectar un nodo al menú de árbol (árbol). Vamos a crear un nodo de árbol alimento que contenga frutas y verduras, y luego añadir un poco de otra fruta al nodo de la fruta existente.
Crear árbol de alimentos
En primer lugar, creamos árbol de la comida, el código es el siguiente:
<Div style = "width: 200px; height: auto; border: 1px #ccc sólido;"> <Id = "tt" ul class = url "easyui-árbol" = "tree_data.json"> </ ul> </ Div>
Tenga en cuenta que el componente de árbol (árbol) se define en la etiqueta <ul>, datos del nodo de árbol cargan desde URL "tree_data.json".
Obtener el nodo padre
Luego elegimos nodo de fruta haciendo clic en el nodo, vamos a añadir algunos otros datos de fruta. Ejecutivo getSelected obtuvo nodo de procesamiento:
nodo var = $ ( '# tt') del árbol ( 'GetSelected') .;
return resultado método getSelected es un objeto de javascript que tiene un id, texto, el objetivo de la propiedad. propiedad de destino es una referencia a un objeto DOM se selecciona el nodo, su método de agregación se utiliza para nodos secundarios adicionales.
nodos adicionales
nodo var = $ ( '# tt') del árbol ( 'GetSelected') .; si (nodo) { nodos var = [{ "Id": 13, "Texto": "frambuesa" }, { "Id": 14, "Texto": "Melón" }]; $ ( '# Tt'). Árbol ( 'append', { padres: node.target, de datos: los nodos }); }
Cuando se agrega un poco de fruta, verá:
Como se puede ver, el uso de árboles easyui (Árbol) plug-in para un nodo adicional no es tan difícil.