3 pagine in totale: <<Indietro 1 2 [3]
Oltre alla funzione javascript il nostro controllo ha la funzione principale di generare codice HTML che per il nostro caso sarà un normale anchor simile a questo:
<a href="javascript:PopupButtonClick('__doPostBack(\'pbtn1\',\'\')','pagina1.htm','width=500,height=150');">Testo link</a>Il link che creiamo non fa altro che richiamare la nostra funzione Javascript passando i paramentri necessari.
Generare il codice HTML
Il metodo principale è il metodo Render che verrà richiamato dal nostro controllo padre e merita un maggior approfondimento.
Riceve un tipo HtmlTextWriter, una classe che scrive nel buffer di output il codice HTML che sarà poi inviato al client. Offre inoltre dei metodi per renderci la vita facile nel scrivere codice HTML evitando così errori di tag non chiusi, concatenati o mal formattati. Se volessimo scrivere un codice come questo:
<span class="code">prova</span>dovremo scrivere:
HtmlTextWriter.WriteBeginTag("span")
HtmlTextWriter.WriteAttribute("class","code")
HtmlTextWriter.Write("prova")
HtmlTextWriter.WriteEndTag("span")Bisogna però prestare attenzione al fatto che il nostro controllo può contenere altri controlli, bisognerà quindi richiamare il metodo Render della collezione Controls. Non è questo il caso, poiché creeremo un normale anchor. Sfruttermo inoltre il metodo Render della classe base che richiama già altre tre funzioni (in questa sequenza):
RenderBeginTag
RenderContents
RenderEndTagIl primo e il terzo metodo aprono e chiudono il tag 'a' (che ricordate, avevamo specificato nel costruttore).
In particolare RenderBeginTag chiama a sua volta il metodo AddAttributesToRender, che non fa altro che aggiungere gli attributi che servono al nostro tag. E' in questo momento che l'aver ereditato da WebControl ci viene utile. Il metodo base effettua il rendering delle proprietà riguardanti l'aspetto e lo style e quindi ci evita un bel po' di lavoro.
Gli attributi per l'aspetto però non bastano, dobbiamo aggiungere un nostro attributo e cioè href (il link che richiamerà la funzione), perciò sovrascriviamolo aggiungendo le nostre istruzioni:
protected override void AddAttributesToRender(HtmlTextWriter writer)
{
//richiamo il metodo base che aggiunge gli attributi per l'aspetto ecc.
base.AddAttributesToRender(writer);
if (base.Page != null)
{
Page.VerifyRenderingInServerForm(this);
}
if (base.Enabled && (base.Page != null))
{
writer.AddAttribute(HtmlTextWriterAttribute.Href,
"javascript:PopupButtonClick('"+ Page.GetPostBackClientEvent(this,"").Replace("'","\\'") +"','" +
UrlPage + "','width="+ WindowWidth +",height="+ WindowHeight +"');");
}
}Fermiamoci un attimo sul codice appena mostrato. Il metodo VerifyRenderingInServerForm della classe Page verifica che il nostro controllo (passato con this) sia all'interno del tag 'form' (con controllo lato server) poiché necessiamo del salvataggio del Viewstate e della possibilità di effettuare postbacks.
Il secondo metodo richiamato da Render, RenderContent , va invece a richiamare il metodo Render dei controlli figli, cosa che non va bene e non serve per il nostro controllo. Perciò lo sovrascriviamo e scriviamo nell'output la proprietà Text:
protected override void RenderContents(HtmlTextWriter writer)
{
writer.Write(this.Text);
} Da notare che in questo caso, a differenza degli altri, non è stato richiamato il metodo base.
Abbiamo quindi creato le proprietà, la logica per il rendering del controllo, ora non ci resta che gestire l'evento scatenato dalla funzione di postback.
Per far ciò dobbiamo implementare l'interfaccia IpostBackEventHandler (namespace System.Web.UI).
Il metodo RaisePostBackEvent di tale interfaccia viene richiamato dal motore ASP.NET in base alla valorizzazione della variabile nascosta __EVENTTARGET con il nome univoco del controllo (proprietà UniqueId del controllo). Riceviamo inoltre un paramentro eventArgument per distinguere magari più eventi, ma nel nostro caso non ci interessa.
Come possiamo sfruttare questo metodo? Lo useremo per scatenare un evento da esporre a chi usa il controllo.
Ecco il codice:
public event EventHandler PopupClosed;
public void RaisePostBackEvent(string eventArgument)
{
OnPopupClosed();
}
protected virtual void OnPopupClosed()
{
if (PopupClosed!=null)
PopupClosed(this,EventArgs.Empty);
}Si dichiara un evento PopupClosed con un delegate EventHandler (per maggiori informazioni si veda questo script ) e lo si richiama qualora vi sia almeno un puntatore di funzione "in ascolto". Eventi simili a questi li usiamo tutti i giorni, come Click per i bottoni o TextChanged per una textbox.
Il potente parser ASP.NET inoltre sarà in grado di gestire l'evento mediante l'attributo on[evento] dove evento è in questo caso PopupClosed.
Attenzione al fatto che, ovviamente, non ha niente a che vedere con la funzione OnPopupClosed usata nel controllo per scatenare l'evento.
Gestire il Viewstate
Rimane per ultimo l'utilizzo del Viewstate che ci permette di memorizzare i valori delle nostre proprietà al fine di mantenerli tra eventuali postbacks. Le proprietà che specifichiamo nelle pagina, infatti, vengono inizializzate in fase di init ad ogni nuovo richiamo della stessa. Se tutte queste proprietà non cambiano ad ogni postback ecco che il Viewstate è inutile, ma questa eventualità non è di facile previsione.
Utilizzando la Viewstate bag che ogni controllo ha a disposizione (una sorta di contenitore in cui riporre le proprie informazioni) possiamo memorizzare le nostre informazioni e mantenerle tra i postbacks. Inoltre, la proprietà EnableViewState (comune a tutti i controlli) è della classe Control. Basterà quindi impostarla a false e le nostre informazioni non verranno salvate.
Sfruttiamo le proprietà per eseguire il salvataggio del valore nel viewstate, es:
public string Text
{
get
{
return base.ViewState["Text"];
}
set
{
base.ViewState["Text"]=value;
}
}Anche in questo caso possiamo usare vari approcci. Nel codice precedente memorizziamo e preleviamo la proprietà Text dalla collezione ViewState, ma potremmo anche mantenerle in una variabile privata per poi memorizzarla o caricarla nel Viewstate sovrascrivendo i metodi SaveViewState, LoadViewState, che verranno richiamati dal motore rispettivamente dopo la fase di prerendering e dopo la fase di init.
Nell'allegato, ho creato una pagina ASP.NET contenente due istanze del nostro controllo. Vedrete che nel Page_Load imposto al primo richiamo della pagina la dimensione delle due finestre a 500 px di larghezza. Il secondo controllo di nome pbtn2 però, ha la proprietà EnableViewState = false. Aprendo una finestra e chiudendola, scatterà il primo postback. Ora, se provate ad aprire il link 1, la finestra avrà dimensioni di 500 px, mentre aprendo la seconda, vedrete che avrà la dimensione di default: 200 px. Questo succede poiché durante il postback la proprietà Width del controllo è andata persa a causa del Viewstate disabilitato.
Conlusioni
Abbiamo affrontanto la maggior parte delle caratteristiche utili per lo sviluppo di web controls con un esempio semplice, ma che a mio modo di vedere è un ottimo punto per cominciare a sviluppare anche controlli associabili ad una sorgente dati.
Ancora una volta l'invito è come sempre a provare a costruirne di vostri partendo dall'esempio qui mostrato. Buon divertimento!
Approfondimenti
- Web Form e Web Controls
- Javascript e ASP.NET
- #440 - Effettuare chiamate asincrone con i delegates di .NET
3 pagine in totale: <<Indietro 1 2 [3]
Attenzione: Questo articolo contiene un allegato
Contenuti dell'articolo
- Galleria fotografica dinamica con ASP.NET AJAX
- Usare Search come un servizio nei tuoi siti e nei tuoi client
- Mappe nel tuo sito con Virtual Earth
- Integrare Windows Live ID, Contacts e Presence API nelle tue applicazioni
- Introduzione ai cloud based service con Windows Live Services
- Realizzare un custom extender AJAX con ASP.NET 3.5
- Tracciare le modifiche ai dati e allineare i datawarehouse con il Change Data Capture in SQL Server 2008
- Le nuove caratteristiche di IIS 7.0 per sviluppatori e sistemisti
Aggiungi un nuovo commento »»»
Per inserire un commento, devi registrarti alla nostra community.
Difficoltà
Stampa 
Download
10annidi.ASPItalia.com: iscriviti alla competizione e vinci fantastici premi ogni mese!
