Interazione con la pagina di contenuto dalla pagina master (C#)
Esamina come chiamare i metodi, impostare le proprietà e così via della pagina contenuto dal codice nella pagina master.
Introduzione
L'esercitazione precedente ha esaminato come fare in modo che la pagina del contenuto interagisca a livello di codice con la relativa pagina master. Tenere presente che la pagina master è stata aggiornata per includere un controllo GridView che elenca i cinque prodotti aggiunti più di recente. È stata quindi creata una pagina di contenuto da cui l'utente potrebbe aggiungere un nuovo prodotto. Dopo aver aggiunto un nuovo prodotto, la pagina del contenuto doveva indicare alla pagina master di aggiornare gridView in modo che includa il prodotto appena aggiunto. Questa funzionalità è stata eseguita aggiungendo un metodo pubblico alla pagina master che ha aggiornato i dati associati a GridView e quindi richiamando tale metodo dalla pagina del contenuto.
La forma più comune di interazione tra contenuto e pagina master ha origine dalla pagina del contenuto. Tuttavia, è possibile che la pagina master instrada la pagina di contenuto corrente in azione e tale funzionalità potrebbe essere necessaria se la pagina master contiene elementi dell'interfaccia utente che consentono agli utenti di modificare i dati visualizzati anche nella pagina del contenuto. Si consideri una pagina di contenuto che visualizza le informazioni sui prodotti in un controllo GridView e una pagina master che include un controllo Button che, quando si fa clic, raddoppia i prezzi di tutti i prodotti. Analogamente all'esempio dell'esercitazione precedente, GridView deve essere aggiornato dopo aver fatto clic sul pulsante a prezzo doppio in modo che visualizzi i nuovi prezzi, ma in questo scenario è la pagina master che deve instradare la pagina del contenuto in azione.
Questa esercitazione illustra come definire la funzionalità di richiamo della pagina master nella pagina del contenuto.
Instigating Programmatic Interaction via an Event and Event Handlers
Richiamare la funzionalità della pagina del contenuto da una pagina master è più complessa rispetto all'altro. Poiché una pagina di contenuto ha una singola pagina master, quando si effettua l'interazione a livello di codice dalla pagina del contenuto si conoscono i metodi e le proprietà pubblici a disposizione. Una pagina master, tuttavia, può avere molte pagine di contenuto diverse, ognuna con un proprio set di proprietà e metodi. In che modo è quindi possibile scrivere codice nella pagina master per eseguire un'azione nella relativa pagina di contenuto quando non si conosce la pagina di contenuto che verrà richiamata fino al runtime?
Si consideri un controllo Web ASP.NET, ad esempio il controllo Button. Un controllo Pulsante può essere visualizzato in un numero qualsiasi di pagine ASP.NET e richiede un meccanismo in base al quale può avvisare la pagina su cui è stato fatto clic. Questa operazione viene eseguita usando gli eventi. In particolare, il controllo Button genera l'evento Click
quando viene fatto clic. La pagina ASP.NET che contiene il pulsante può facoltativamente rispondere a tale notifica tramite un gestore eventi.
Questo stesso modello può essere usato per avere una funzionalità di trigger di pagina master nelle pagine di contenuto:
- Aggiungere un evento alla pagina master.
- Generare l'evento ogni volta che la pagina master deve comunicare con la relativa pagina di contenuto. Ad esempio, se la pagina master deve avvisare la pagina del contenuto che l'utente ha raddoppiato i prezzi, l'evento verrà generato immediatamente dopo il raddoppio dei prezzi.
- Creare un gestore eventi in tali pagine di contenuto che devono eseguire alcune azioni.
Questa parte restante di questa esercitazione implementa l'esempio descritto in Introduzione; ovvero una pagina di contenuto che elenca i prodotti nel database e una pagina master che include un controllo Button per raddoppiare i prezzi.
Passaggio 1: Visualizzazione di prodotti in una pagina contenuto
Il nostro primo ordine di attività consiste nel creare una pagina di contenuto che elenca i prodotti del database Northwind. Il database Northwind è stato aggiunto al progetto nell'esercitazione precedente. Interazione con la pagina master dalla pagina contenuto. Per iniziare, aggiungere una nuova pagina ASP.NET alla ~/Admin
cartella denominata Products.aspx
, assicurandosi di associarla alla Site.master
pagina master. La figura 1 mostra il Esplora soluzioni dopo l'aggiunta di questa pagina al sito Web.
Figura 01: Aggiungere una nuova pagina ASP.NET alla cartella (fare clic per visualizzare l'immagine Admin
a dimensione intera)
Tenere presente che nell'esercitazione Specificare titolo, meta tag e altre intestazioni HTML nell'esercitazione pagina master è stata creata una classe di pagina di base personalizzata denominata BasePage
che genera il titolo della pagina se non è impostata in modo esplicito. Passare alla Products.aspx
classe code-behind della pagina e fare in modo che derivi da BasePage
(anziché da System.Web.UI.Page
).
Aggiornare infine il Web.sitemap
file in modo da includere una voce per questa lezione. Aggiungere il markup seguente sotto per la <siteMapNode>
lezione Interazione da contenuto a pagina master:
<siteMapNode url="~/Admin/Products.aspx" title="Master to Content Page Interaction" />
L'aggiunta di questo <siteMapNode>
elemento viene riflessa nell'elenco Lezioni (vedere la figura 5).
Tornare a Products.aspx
. Nel controllo Contenuto per MainContent
aggiungere un controllo GridView e denominarlo ProductsGrid
. Associare GridView a un nuovo controllo SqlDataSource denominato ProductsDataSource
.
Figura 02: Associare GridView a un nuovo controllo SqlDataSource (fare clic per visualizzare l'immagine a dimensione intera)
Configurare la procedura guidata in modo che usi il database Northwind. Se si è usata l'esercitazione precedente, è necessario avere già un stringa di connessione denominato NorthwindConnectionString
in Web.config
. Scegliere questa stringa di connessione dall'elenco a discesa, come illustrato nella figura 3.
Figura 03: Configurare SqlDataSource per l'uso del database Northwind (fare clic per visualizzare l'immagine a dimensione intera)
Specificare quindi l'istruzione del SELECT
controllo origine dati scegliendo la tabella Products dall'elenco a discesa e restituendo le ProductName
colonne e UnitPrice
(vedere la figura 4). Fare clic su Avanti e quindi su Fine per completare la procedura guidata Configura origine dati.
Figura 04: Restituire i ProductName
campi e UnitPrice
dalla Products
tabella (fare clic per visualizzare l'immagine a dimensione intera)
Questo è tutto ciò che occorre fare. Dopo aver completato la procedura guidata, Visual Studio aggiunge due BoundFields a GridView per eseguire il mirroring dei due campi restituiti dal controllo SqlDataSource. Il markup dei controlli GridView e SqlDataSource segue. La figura 5 mostra i risultati visualizzati tramite un browser.
<asp:GridView ID="ProductsGrid" runat="server" AutoGenerateColumns="False"
DataSourceID="ProductsDataSource">
<Columns>
<asp:BoundField DataField="ProductName" HeaderText="ProductName"
SortExpression="ProductName" />
<asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice"
SortExpression="UnitPrice" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="ProductsDataSource" runat="server"
ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
SelectCommand="SELECT [ProductName], [UnitPrice] FROM [Products]">
</asp:SqlDataSource>
Figura 05: Ogni prodotto e il relativo prezzo sono elencati in GridView (fare clic per visualizzare l'immagine a dimensione intera)
Nota
È possibile pulire l'aspetto di GridView. Alcuni suggerimenti includono la formattazione del valore UnitPrice visualizzato come valuta e l'uso di colori e tipi di carattere di sfondo per migliorare l'aspetto della griglia. Per altre informazioni sulla visualizzazione e la formattazione dei dati in ASP.NET, vedere la serie di esercitazioni sull'uso dei dati.
Passaggio 2: Aggiunta di un pulsante a prezzi doppi alla pagina master
L'attività successiva consiste nell'aggiungere un controllo Web Button alla pagina master che, quando si fa clic, raddoppierà il prezzo di tutti i prodotti nel database. Aprire la Site.master
pagina master e trascinare un pulsante dalla casella degli strumenti nella finestra di progettazione, posizionandolo sotto il RecentProductsDataSource
controllo SqlDataSource aggiunto nell'esercitazione precedente. Impostare la proprietà Button ID
su DoublePrice
e la relativa Text
proprietà su "Double Product Prices".
Aggiungere quindi un controllo SqlDataSource alla pagina master, denominandolo DoublePricesDataSource
. Questo oggetto SqlDataSource verrà usato per eseguire l'istruzione UPDATE
per raddoppiare tutti i prezzi. In particolare, è necessario impostarne ConnectionString
le proprietà e UpdateCommand
sulla stringa di connessione e UPDATE
l'istruzione appropriati. È quindi necessario chiamare il metodo del Update
controllo SqlDataSource quando DoublePrice
si fa clic su Button. Per impostare le ConnectionString
proprietà eUpdateCommand
, selezionare il controllo SqlDataSource e quindi passare al Finestra Proprietà. La ConnectionString
proprietà elenca le stringa di connessione già archiviate in Web.config
un elenco a discesa. Scegliere l'opzione NorthwindConnectionString
come illustrato nella figura 6.
Figura 06: Configurare SqlDataSource per l'uso di (fare clic per visualizzare l'immagine NorthwindConnectionString
a dimensione intera)
Per impostare la UpdateCommand
proprietà, individuare l'opzione UpdateQuery nella Finestra Proprietà. Questa proprietà, se selezionata, visualizza un pulsante con puntini di sospensione; Fare clic su questo pulsante per visualizzare la finestra di dialogo Editor di comandi e parametri illustrata nella figura 7. Digitare l'istruzione seguente UPDATE
nella casella di testo della finestra di dialogo:
UPDATE Products SET UnitPrice = UnitPrice * 2
Questa istruzione, quando eseguita, raddoppierà il UnitPrice
valore per ogni record nella Products
tabella.
Figura 07: Impostare la proprietà di UpdateCommand
SqlDataSource (fare clic per visualizzare l'immagine a dimensione intera)
Dopo aver impostato queste proprietà, il markup dichiarativo dei controlli Button e SqlDataSource dovrebbe essere simile al seguente:
<asp:Button ID="DoublePrice" runat="server"
Text="Double Product Prices" />
<asp:SqlDataSource ID="DoublePricesDataSource" runat="server"
UpdateCommand="UPDATE Products SET UnitPrice = UnitPrice * 2"
ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
ProviderName="<%$ ConnectionStrings:NorthwindConnectionString.ProviderName %>">
</asp:SqlDataSource>
Tutto ciò che rimane consiste nel chiamare il relativo Update
metodo quando DoublePrice
si fa clic su Button. Creare un Click
gestore eventi per Button DoublePrice
e aggiungere il codice seguente:
protected void DoublePrice_Click(object sender, EventArgs e)
{
// Double the prices
DoublePricesDataSource.Update();
}
Per testare questa funzionalità, visitare la ~/Admin/Products.aspx
pagina creata nel passaggio 1 e fare clic sul pulsante "Double Product Prices". Facendo clic sul pulsante viene generato un postback e viene eseguito il DoublePrice
gestore eventi di Click
Button, raddoppiando i prezzi di tutti i prodotti. Viene quindi eseguito di nuovo il rendering della pagina e il markup viene restituito e nuovamente visualizzato nel browser. GridView nella pagina del contenuto, tuttavia, elenca gli stessi prezzi di prima che sia stato fatto clic sul pulsante "Double Product Prices". Ciò è dovuto al fatto che i dati caricati inizialmente in GridView avevano lo stato archiviato nello stato di visualizzazione, quindi non vengono ricaricati sui postback, a meno che non venga specificato diversamente. Se si visita una pagina diversa e quindi si torna alla ~/Admin/Products.aspx
pagina verranno visualizzati i prezzi aggiornati.
Passaggio 3: Generazione di un evento quando i prezzi vengono raddoppiati
Poiché GridView nella ~/Admin/Products.aspx
pagina non riflette immediatamente il raddoppio dei prezzi, un utente potrebbe pensare comprensibilmente che non abbia fatto clic sul pulsante "Double Product Prices" o che non funzionasse. Potrebbero provare a fare clic sul pulsante alcune volte, raddoppiando nuovamente i prezzi e ancora una volta. Per risolvere questo problema, è necessario che la griglia nella pagina del contenuto visualizzi i nuovi prezzi immediatamente dopo il raddoppio.
Come illustrato in precedenza in questa esercitazione, è necessario generare un evento nella pagina master ogni volta che l'utente fa clic sul DoublePrice
pulsante. Un evento è un modo per una classe (un editore di eventi) per notificare a un altro set di altre classi (sottoscrittori di eventi) che si è verificato un evento interessante. In questo esempio la pagina master è l'autore dell'evento; le pagine di contenuto che interessano quando si fa clic sul DoublePrice
pulsante sono i sottoscrittori.
Una classe sottoscrive un evento creando un gestore eventi, ovvero un metodo eseguito in risposta all'evento generato. L'autore definisce gli eventi generati definendo un delegato di evento. Il delegato dell'evento specifica i parametri di input che il gestore eventi deve accettare. In .NET Framework i delegati di eventi non restituiscono alcun valore e accettano due parametri di input:
- Oggetto
Object
, che identifica l'origine evento e - Classe derivata da
System.EventArgs
Il secondo parametro passato a un gestore eventi può includere informazioni aggiuntive sull'evento. Anche se la classe di base EventArgs
non passa alcuna informazione, .NET Framework include una serie di classi che estendono EventArgs
e includono proprietà aggiuntive. Ad esempio, un'istanza CommandEventArgs
viene passata ai gestori eventi che rispondono all'evento Command
e include due proprietà informative: CommandArgument
e CommandName
.
Nota
Per altre informazioni sulla creazione, la generazione e la gestione di eventi, vedere Eventi e delegati e delegati di eventi in inglese semplice.
Per definire un evento, utilizzare la sintassi seguente:
public event eventDelegate eventName;
Poiché è sufficiente avvisare la pagina del contenuto quando l'utente ha fatto clic sul DoublePrice
pulsante e non è necessario passare altre informazioni aggiuntive, è possibile usare il delegato EventHandler
dell'evento , che definisce un gestore eventi che accetta come secondo parametro un oggetto di tipo System.EventArgs
. Per creare l'evento nella pagina master, aggiungere la riga di codice seguente alla classe code-behind della pagina master:
public partial class Site : System.Web.UI.MasterPage
{
public event EventHandler PricesDoubled;
...
}
Il codice precedente aggiunge un evento pubblico alla pagina master denominata PricesDoubled
. Dobbiamo ora sollevare questo evento dopo che i prezzi sono stati raddoppiati. Per generare un evento, usare la sintassi seguente:
if (eventName != null)
eventName(sender, eventArgs);
Dove sender e eventArgs sono i valori che si desidera passare al gestore eventi del sottoscrittore.
Aggiornare il DoublePrice
Click
gestore eventi con il codice seguente:
protected void DoublePrice_Click(object sender, EventArgs e)
{
// Double the prices
DoublePricesDataSource.Update();
// Refresh RecentProducts
RecentProducts.DataBind();
// Raise the PricesDoubled event
if (PricesDoubled != null)
PricesDoubled(this, EventArgs.Empty);
}
Come in precedenza, il Click
gestore eventi inizia chiamando il DoublePricesDataSource
metodo del Update
controllo SqlDataSource per raddoppiare i prezzi di tutti i prodotti. Dopo aver aggiunto due aggiunte al gestore eventi. Prima di tutto, i RecentProducts
dati di GridView vengono aggiornati. Questo controllo GridView è stato aggiunto alla pagina master nell'esercitazione precedente e visualizza i cinque prodotti aggiunti più di recente. Dobbiamo aggiornare questa griglia in modo che mostri i prezzi just-doubled per questi cinque prodotti. In seguito, viene generato l'evento PricesDoubled
. Un riferimento alla pagina master stessa (this
) viene inviato al gestore eventi come origine evento e un oggetto vuoto EventArgs
viene inviato come argomenti dell'evento.
Passaggio 4: Gestione dell'evento nella pagina contenuto
A questo punto la pagina master genera l'evento PricesDoubled
ogni volta che si fa clic sul DoublePrice
controllo Button. Tuttavia, questa è solo la metà della battaglia - dobbiamo comunque gestire l'evento nel sottoscrittore. Ciò comporta due passaggi: la creazione del gestore eventi e l'aggiunta di codice di collegamento degli eventi in modo che quando viene generato l'evento viene eseguito il gestore eventi.
Per iniziare, creare un gestore eventi denominato Master_PricesDoubled
. A causa della modalità di definizione dell'evento PricesDoubled
nella pagina master, i due parametri di input del gestore eventi devono essere rispettivamente di tipi Object
e EventArgs
. Nel gestore eventi chiamare il ProductsGrid
metodo gridView DataBind
per riassociare i dati alla griglia.
private void Master_PricesDoubled(object sender, EventArgs e)
{
// Rebind data to ProductsGrid
ProductsGrid.DataBind();
}
Il codice per il gestore eventi è completo, ma è ancora necessario collegare l'evento della PricesDoubled
pagina master a questo gestore eventi. Il sottoscrittore collega un evento a un gestore eventi tramite la sintassi seguente:
publisher.eventName += new eventDelegate(methodName);
publisher è un riferimento all'oggetto che offre eventName e methodName è il nome del gestore eventi definito nel sottoscrittore con una firma corrispondente all'evento EventDelegate. In altre parole, se il delegato dell'evento è EventHandler
, methodName deve essere il nome di un metodo nel sottoscrittore che non restituisce un valore e accetta due parametri di input di tipi Object
e EventArgs
, rispettivamente.
Questo codice di cablaggio di eventi deve essere eseguito nella prima pagina visita e postback successivi e deve verificarsi in un punto del ciclo di vita della pagina che precede quando l'evento può essere generato. Un buon momento per aggiungere il codice di cablaggio degli eventi è nella fase PreInit, che si verifica molto presto nel ciclo di vita della pagina.
Aprire ~/Admin/Products.aspx
e creare un Page_PreInit
gestore eventi:
protected void Page_PreInit(object sender, EventArgs e)
{
// TODO: Put event wiring logic here
}
Per completare questo codice di cablaggio, è necessario un riferimento programmatico alla pagina master dalla pagina del contenuto. Come indicato nell'esercitazione precedente, esistono due modi per eseguire questa operazione:
- Eseguendo il cast della proprietà di tipo
Page.Master
libero sul tipo di pagina master appropriato o - Aggiungendo una
@MasterType
direttiva nella.aspx
pagina e quindi usando la proprietà fortemente tipizzataMaster
.
Si userà il secondo approccio. Aggiungere la direttiva seguente @MasterType
all'inizio del markup dichiarativo della pagina:
<%@ MasterType VirtualPath="~/Site.master" %>
Aggiungere quindi il codice di cablaggio eventi seguente nel Page_PreInit
gestore eventi:
protected void Page_PreInit(object sender, EventArgs e)
{
// Create an event handler for the master page's PricesDoubled event
Master.PricesDoubled += new EventHandler(Master_PricesDoubled);
}
Con questo codice sul posto, GridView nella pagina del contenuto viene aggiornato ogni volta che DoublePrice
si fa clic sul pulsante.
Le cifre 8 e 9 illustrano questo comportamento. La figura 8 mostra la pagina alla prima visita. Si noti che i valori di prezzo sia in RecentProducts
GridView (nella colonna sinistra della pagina master) che ProductsGrid
in GridView (nella pagina del contenuto). La figura 9 mostra la stessa schermata immediatamente dopo che è stato fatto clic sul DoublePrice
pulsante. Come si può notare, i nuovi prezzi sono istantaneamente riflessi in entrambe le visualizzazioni GridView.
Figura 08: Valori prezzo iniziale (fare clic per visualizzare l'immagine a dimensione intera)
Figura 09: I prezzi just-doubled vengono visualizzati in GridViews (fare clic per visualizzare l'immagine a dimensione intera)
Riepilogo
Idealmente, una pagina master e le relative pagine di contenuto sono completamente separate l'una dall'altra e non richiedono alcun livello di interazione. Tuttavia, se si dispone di una pagina master o di contenuto che visualizza i dati che possono essere modificati dalla pagina master o dalla pagina del contenuto, potrebbe essere necessario che la pagina master avvisi la pagina del contenuto (o viceversa) quando i dati vengono modificati in modo che la visualizzazione possa essere aggiornata. Nell'esercitazione precedente è stato illustrato come interagire a livello di codice con una pagina del contenuto con la relativa pagina master; in questa esercitazione è stato illustrato come avviare l'interazione con una pagina master.
Anche se l'interazione a livello di codice tra un contenuto e una pagina master può provenire dal contenuto o dalla pagina master, il modello di interazione usato dipende dall'origine. Le differenze sono dovute al fatto che una pagina di contenuto ha una singola pagina master, ma una pagina master può avere molte pagine di contenuto diverse. Invece di interagire direttamente con una pagina master con una pagina di contenuto, un approccio migliore consiste nell'avere la pagina master generare un evento per segnalare che è stata eseguita un'azione. Le pagine di contenuto che interessano l'azione possono creare gestori eventi.
Buon programmatori!
Altre informazioni
Per altre informazioni sugli argomenti illustrati in questa esercitazione, vedere le risorse seguenti:
- Accesso e aggiornamento dei dati in ASP.NET
- Eventi e delegati
- Passaggio di informazioni tra contenuto e pagine master
- Uso dei dati nelle esercitazioni di ASP.NET
Informazioni sull'autore
Scott Mitchell, autore di più libri ASP/ASP.NET e fondatore di 4GuysFromRolla.com, ha lavorato con le tecnologie Web Microsoft dal 1998. Scott lavora come consulente indipendente, formatore e scrittore. Il suo ultimo libro è Sams Teach Yourself ASP.NET 3.5 in 24 ore. Scott può essere raggiunto all'indirizzo mitchell@4GuysFromRolla.com o tramite il suo blog all'indirizzo http://ScottOnWriting.NET.
Grazie speciale a
Questa serie di esercitazioni è stata esaminata da molti revisori utili. Il revisore principale per questa esercitazione era Suchi Banerjee. Si è interessati a esaminare i prossimi articoli MSDN? In tal caso, lasciami una riga in mitchell@4GuysFromRolla.com