TreeView con CheckBox e AutoPostBack

Il controllo TreeView di ASP .NET permette di visualizzare elenchi gerarchici. Tra le funzionalità offerte, è anche possibile mostrare CheckBox a fianco di ogni elemento. Purtroppo, tale controllo non supporta la proprietà AutoPostBack, quindi ad esempio non è possibile inserirlo "semplicemente" in un UpdatePanel per ottenere chiamate asincrone sul server quando l'utente fa clic su una casella di spunta: tutti gli eventi di check sono processati quando viene generato l'evento SelectedNodeChanged.

Per ottenere "l'effetto AutoPostBack" quando si seleziona una CheckBox, si deve scrivere un po' di BLOCKED SCRIPT

1 function TreeNodeCheckChanged(event, control) { 2 // Valid for IE and Firefox/Safari/Chrome. 3 var obj = window.event ? window.event.srcElement : event.target; 4 var source = window.event ? window.event.srcElement.id : event.target.id; 5 source = source.replace(control.id + "t", control.id + "n"); 6 var checkbox = document.getElementById(source); 7 if (checkbox != null && obj.tagName == "INPUT" && obj.type == "checkbox") { 8 __doPostBack(checkbox.id, ""); 9 } 10 }

Questa funzione recupera il CheckBox relativo all'elemento della TreeView selezionato e utilizza il suo ID per simulare un PostBack della pagina (riga 8). L'aspetto importante è che, specificando tale ID nella chiamata del metodo __doPostBack, se la TreeView è inserita in un UpdatePanel sarà automaticamente eseguita una richiesta di aggiornamento asincrona.

Il passo successivo consiste nel richiamare questa funzione quando di esegue un click sulla TreeView. Questo obiettivo si raggiunge inserendo semplicemente un'istruzione nella routine Page_Load:

protected void Page_Load(object sender, EventArgs e) { TreeView1.Attributes.Add("onclick", "TreeNodeCheckChanged(event, this)"); }

E il gioco è fatto. Se per la TreeView è stato definito l'evento TreeNodeCheckChanged, esso sarà richiamato ogni volta che si fa clic su una casella di spunta, eventualmente in maniera asincrona se il controllo è inserito all'interno di un UpdatePanel.

Technorati Tags: , ,

Comments

# [Cross-Post] Fogli di stile per l'AJAX Control Toolkit e TreeView con CheckBox e AutoPostBack

lunedì 20 ottobre 2008 20.34 by Around and About .NET World

Un po' per i problemi di UGIdotNET , un po' per provare la piattaforma di blogging della nostra