Siguiendo con el anterior artículo de personalizar un TreeView I   para poder editar los nodos hoy veremos precisamente la parte donde habilitamos la edición de los nodos.

Crearemos una nueva clase que llamaremos TreeNodeEdit que heredara de TreeNode. Con esto ya tendremos la base para montar nuestro nodo editable.

[ToolboxData("<{0}:TreeNodeEdit runat=server></{0}:TreeNodeEdit>")]
public class TreeNodeEdit : TreeNode

Crearemos las propiedades públicas para poder configurar nuestro Nodo.

• bool Editable –>Para hablilitar la edición del nodo.
• string TextBoxValue –> Valor de la edición.
• string OldValue –> Valor anterior a la edición.
• string EditImageUrl –> Url del a imagen del botón editar.
• string CancelImageUrl –> Url de la imagen del botón cancalar.
• string SaveImageUrl –> Url de la imagen del botón guardar.
• string EditTooltip –> Tooltip del botón editar.
• string SaveTooltip –> Tooltip del botón guardar.
• string CancelTooltip –> Tooltip del botón cancelar.
• string TextBoxValueCSSView –> estilo del textbox de la edición. Sigue leyendo →

En más de una ocasión nos ha sido de mucha utilidad un control del tipo TreeView para mostrar una jerarquía de datos, pero el control se nos puede quedar un poco limitado cuando pretendemos interactuar con los datos.

Por ese motivo he creado un control TreeView con nodos editables, y el resultado final es como este:

Comenzaremos creando un proyecto de librerías de clase para albergar nuestro control, a la clase le llamaremos TreeViewEdit y heredaremos de System.Web.UI.WebControls.TreeView.

[ToolboxData("<{0}:TreeViewEdit runat=server></{0}:TreeViewEdit>")]
public class TreeViewEdit : TreeView

Realmente toda la potencia del control no se encuentra en el TreeView, sino en los Nodos que le daremos la posibilidad de ser editados. En esta clase lo único que tenemos que hacer es un nuevo evento para capturar la información modificada del nodo. Sigue leyendo →