Interazione con la pagina master dalla pagina di contenuto (VB)

di Scott Mitchell

Esamina come chiamare i metodi, impostare le proprietà e così via della pagina master dal codice nella pagina contenuto.

Introduzione

Nel corso delle ultime cinque esercitazioni è stato illustrato come creare una pagina master, definire aree del contenuto, associare ASP.NET pagine a una pagina master e definire contenuto specifico della pagina. Quando un visitatore richiede una pagina di contenuto particolare, il markup del contenuto e delle pagine master viene fuso in fase di esecuzione, con conseguente rendering di una gerarchia di controllo unificata. Pertanto, abbiamo già visto un modo in cui la pagina master e una delle relative pagine di contenuto possono interagire: la pagina del contenuto specifica il markup per trasfusa nei controlli ContentPlaceHolder della pagina master.

Ciò che è ancora necessario esaminare è il modo in cui la pagina master e la pagina del contenuto possono interagire a livello di codice. Oltre a definire il markup per i controlli ContentPlaceHolder della pagina master, una pagina del contenuto può anche assegnare valori alle proprietà pubbliche della pagina master e richiamare i relativi metodi pubblici. Analogamente, una pagina master può interagire con le relative pagine di contenuto. Sebbene l'interazione programmatica tra un master e una pagina del contenuto sia meno comune dell'interazione tra i markup dichiarativi, esistono molti scenari in cui è necessaria tale interazione programmatica.

In questa esercitazione viene esaminato come una pagina di contenuto può interagire a livello di codice con la relativa pagina master; nell'esercitazione successiva verrà illustrato in che modo la pagina master può interagire in modo analogo con le pagine di contenuto.

Esempi di interazione a livello di codice tra una pagina contenuto e la relativa pagina master

Quando una determinata area di una pagina deve essere configurata in base alla pagina per pagina, viene usato un controllo ContentPlaceHolder. Ma cosa accade nelle situazioni in cui la maggior parte delle pagine deve generare un determinato output, ma un numero ridotto di pagine deve personalizzarlo per mostrare qualcos'altro? Uno di questi esempi, esaminato nell'esercitazione Multiple ContentPlaceHolders e Default Content , implica la visualizzazione di un'interfaccia di accesso in ogni pagina. Anche se la maggior parte delle pagine deve includere un'interfaccia di accesso, deve essere eliminata per alcune pagine, ad esempio: la pagina di accesso principale (Login.aspx), la pagina Crea account e altre pagine accessibili solo agli utenti autenticati. L'esercitazione Su più contentPlaceHolders e contenuto predefinito ha illustrato come definire il contenuto predefinito per un ContentPlaceHolder nella pagina master e quindi come eseguirne l'override in tali pagine in cui il contenuto predefinito non era desiderato.

Un'altra opzione consiste nel creare una proprietà o un metodo pubblico all'interno della pagina master che indica se visualizzare o nascondere l'interfaccia di accesso. Ad esempio, la pagina master può includere una proprietà pubblica denominata ShowLoginUI il cui valore è stato utilizzato per impostare la Visible proprietà del controllo Login nella pagina master. Tali pagine di contenuto in cui l'interfaccia utente di accesso deve essere eliminata potrebbero quindi impostare la ShowLoginUI proprietà a livello di codice su False.

Forse l'esempio più comune di interazione tra contenuto e pagina master si verifica quando i dati visualizzati nella pagina master devono essere aggiornati dopo che alcune azioni sono state traspirate nella pagina del contenuto. Si consideri una pagina master che include un controllo GridView che visualizza i cinque record aggiunti più di recente da una tabella di database specifica e che una delle relative pagine di contenuto include un'interfaccia per l'aggiunta di nuovi record alla stessa tabella.

Quando un utente visita la pagina per aggiungere un nuovo record, visualizza i cinque record aggiunti più di recente visualizzati nella pagina master. Dopo aver compilato i valori per le colonne del nuovo record, invia il modulo. Supponendo che la proprietà GridView nella pagina EnableViewState master sia impostata su True (impostazione predefinita), il relativo contenuto viene ricaricato dallo stato di visualizzazione e, di conseguenza, vengono visualizzati gli stessi cinque record anche se un record più recente è stato appena aggiunto al database. Ciò può confondere l'utente.

Per risolvere questo problema, in modo che il record appena aggiunto venga visualizzato nel controllo GridView della pagina master nel postback, è necessario indicare a GridView di riassociare l'origine dati dopo l'aggiunta del nuovo record al database. Ciò richiede l'interazione tra il contenuto e le pagine master perché l'interfaccia per l'aggiunta del nuovo record (e i relativi gestori eventi) si trovano nella pagina del contenuto, ma GridView che deve essere aggiornato si trova nella pagina master.

Poiché l'aggiornamento della visualizzazione della pagina master da un gestore eventi nella pagina del contenuto è una delle esigenze più comuni per l'interazione tra contenuto e pagina master, esaminiamo questo argomento in modo più dettagliato. Il download per questa esercitazione include un database di Microsoft SQL Server 2005 Express Edition denominato NORTHWIND.MDF nella cartella del App_Data sito Web. Il database Northwind archivia le informazioni su prodotti, dipendenti e vendite per una società fittizia, Northwind Traders.

Il passaggio 1 illustra la visualizzazione dei cinque prodotti aggiunti più di recente in un controllo GridView nella pagina master. Il passaggio 2 crea una pagina di contenuto per l'aggiunta di nuovi prodotti. Il passaggio 3 illustra come creare proprietà e metodi pubblici nella pagina master e il passaggio 4 illustra come interfacciarsi a livello di codice con queste proprietà e metodi dalla pagina del contenuto.

Passaggio 1: Visualizzazione dei cinque prodotti aggiunti più di recente nella pagina master

Aprire la pagina master Site.master e aggiungere un'etichetta e un controllo GridView all'oggetto leftContent <div>. Deselezionare la proprietà dell'etichetta Text , impostarne la EnableViewState proprietà su Falsee la relativa ID proprietà su GridMessage. Impostare la proprietà di ID GridView su RecentProducts. Successivamente, in Progettazione espandere lo smart tag gridView e scegliere di associarlo a una nuova origine dati. Verrà avviata la configurazione guidata origine dati. Poiché il database Northwind nella App_Data cartella è un database di Microsoft SQL Server, scegliere di creare un'istanza di SqlDataSource selezionando (vedere la figura 1); denominare SqlDataSource RecentProductsDataSource.

Figura 01: Associare GridView a un controllo SqlDataSource denominato RecentProductsDataSource (fare clic per visualizzare l'immagine a dimensione intera)

Il passaggio successivo chiede di specificare il database a cui connettersi. Scegliere il file di NORTHWIND.MDF database dall'elenco a discesa e fare clic su Avanti. Poiché questa è la prima volta che è stato usato questo database, la procedura guidata offrirà di archiviare il stringa di connessione in Web.config. Archiviare il stringa di connessione usando il nome NorthwindConnectionString.

Figura 02: Connettersi al database Northwind (fare clic per visualizzare l'immagine a dimensione intera)

La procedura guidata Configura origine dati consente di specificare due modi per specificare la query usata per recuperare i dati:

• Specificando un'istruzione SQL personalizzata o una stored procedure oppure
• Selezionando una tabella o una vista e quindi specificando le colonne da restituire

Poiché si vogliono restituire solo i cinque prodotti aggiunti più di recente, è necessario specificare un'istruzione SQL personalizzata. Usare la query seguente SELECT :

SELECT TOP 5 ProductName, UnitPrice FROM Products ORDER BY ProductID DESC

La TOP 5 parola chiave restituisce solo i primi cinque record della query. La Products chiave primaria della tabella, ProductID, è una IDENTITY colonna, che assicura che ogni nuovo prodotto aggiunto alla tabella avrà un valore maggiore rispetto alla voce precedente. Pertanto, l'ordinamento dei risultati ProductID in ordine decrescente restituisce i prodotti a partire da quelli creati più di recente.

Figura 03: Restituire i cinque prodotti aggiunti più di recente (fare clic per visualizzare l'immagine a dimensione intera)

Dopo aver completato la procedura guidata, Visual Studio genera due campi BoundField per GridView per visualizzare i ProductName campi e UnitPrice restituiti dal database. A questo punto il markup dichiarativo della pagina master deve includere markup simile al seguente:

<asp:Label ID="GridMessage" runat="server" EnableViewState="false"></asp:Label> 
<asp:GridView ID="RecentProducts" runat="server" AutoGenerateColumns="False" 
 DataSourceID="RecentProductsDataSource">
 <Columns> 
 <asp:BoundField DataField="ProductName" HeaderText="ProductName" 
 SortExpression="ProductName" /> 
 <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" 
 SortExpression="UnitPrice" /> 
 </Columns> 
</asp:GridView> 
<asp:SqlDataSource ID="RecentProductsDataSource" runat="server" 
 ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" 
 SelectCommand="SELECT TOP 5 ProductName, UnitPrice FROM Products ORDER BY ProductID DESC"> 
</asp:SqlDataSource>

Come si può notare, il markup contiene: il controllo Web Label (GridMessage); GridView RecentProducts, con due BoundFields e un controllo SqlDataSource che restituisce i cinque prodotti aggiunti più di recente.

Con questo controllo GridView creato e il relativo controllo SqlDataSource configurato, visitare il sito Web tramite un browser. Come illustrato nella figura 4, verrà visualizzata una griglia nell'angolo inferiore sinistro che elenca i cinque prodotti aggiunti più di recente.

Figura 04: GridView visualizza i cinque prodotti aggiunti più di recente (fare clic per visualizzare l'immagine a dimensione intera)

Passaggio 2: Creazione di una pagina contenuto per aggiungere nuovi prodotti

L'attività successiva consiste nel creare una pagina di contenuto da cui un utente può aggiungere un nuovo prodotto alla Products tabella. Aggiungere una nuova pagina di contenuto alla Admin cartella denominata AddProduct.aspx, assicurandosi di associarla alla Site.master pagina master. La figura 5 mostra il Esplora soluzioni dopo l'aggiunta di questa pagina al sito Web.

Figura 05: Aggiungere una nuova pagina ASP.NET alla cartella (fare clic per visualizzare l'immagine Admina 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 ha generato il titolo della pagina se non è stata impostata in modo esplicito. Passare alla AddProduct.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 Problemi di denominazione dell'ID di controllo:

<siteMapNode url="~/Admin/AddProduct.aspx" title="Content to Master Page Interaction" />

Come illustrato nella figura 6, l'aggiunta di questo <siteMapNode> elemento viene riflessa nell'elenco Lezioni.

Tornare a AddProduct.aspx. Nel controllo Contenuto per MainContent ContentPlaceHolder aggiungere un controllo DetailsView e denominarlo NewProduct. Associare DetailsView a un nuovo controllo SqlDataSource denominato NewProductDataSource. Analogamente a SqlDataSource nel passaggio 1, configurare la procedura guidata in modo che usi il database Northwind e scegliere di specificare un'istruzione SQL personalizzata. Poiché DetailsView verrà usato per aggiungere elementi al database, è necessario specificare sia un'istruzione SELECT che un'istruzione INSERT . Usare la query seguente SELECT :

SELECT ProductName, UnitPrice FROM Products

Quindi, dalla scheda INSERT aggiungere l'istruzione seguente INSERT :

INSERT INTO Products(ProductName, UnitPrice) VALUES(@ProductName, @UnitPrice)

Dopo aver completato la procedura guidata, passare allo smart tag DetailsView e selezionare la casella di controllo "Abilita inserimento". Verrà aggiunto un oggetto CommandField a DetailsView con la relativa ShowInsertButton proprietà impostata su True. Poiché questo controllo DetailsView verrà usato esclusivamente per l'inserimento di dati, impostare la proprietà DetailsView DefaultMode su Insert.

Questo è tutto ciò che occorre fare. Testiamo questa pagina. Visitare AddProduct.aspx un browser, immettere un nome e un prezzo (vedere la figura 6).

Figura 06: Aggiungere un nuovo prodotto al database (fare clic per visualizzare l'immagine a dimensione intera)

Dopo aver digitato il nome e il prezzo del nuovo prodotto, fare clic sul pulsante Inserisci. In questo modo il form viene postback. Al postback viene eseguita l'istruzione del INSERT controllo SqlDataSource. I due parametri vengono popolati con i valori immessi dall'utente nei due controlli TextBox di DetailsView. Sfortunatamente, non c'è alcun feedback visivo che si è verificato un inserimento. Sarebbe bello visualizzare un messaggio, confermando che è stato aggiunto un nuovo record. Lascio questo come esercizio per il lettore. Inoltre, dopo aver aggiunto un nuovo record da DetailsView, gridView nella pagina master mostra ancora gli stessi cinque record di prima; non include il record appena aggiunto. Si esaminerà come risolvere questo problema nei passaggi successivi.

Passaggio 3: Creazione di proprietà e metodi pubblici nella pagina master

Nel passaggio 1 è stato aggiunto un controllo Web etichetta denominato GridMessage sopra GridView nella pagina master. Questa etichetta è progettata per visualizzare facoltativamente un messaggio. Ad esempio, dopo aver aggiunto un nuovo record alla Products tabella, potrebbe essere necessario visualizzare un messaggio che legge: "ProductName è stato aggiunto al database". Anziché impostare come hardcoded il testo per questa etichetta nella pagina master, è possibile che il messaggio sia personalizzabile dalla pagina del contenuto.

Poiché il controllo Etichetta viene implementato come variabile membro protetta all'interno della pagina master, non è possibile accedervi direttamente dalle pagine del contenuto. Per usare l'etichetta all'interno di una pagina master dalla pagina del contenuto (o, per tale motivo, qualsiasi controllo Web nella pagina master) è necessario creare una proprietà pubblica nella pagina master che espone il controllo Web o funge da proxy a cui è possibile accedere una delle relative proprietà. Aggiungere la sintassi seguente alla classe code-behind della pagina master per esporre la proprietà dell'etichetta Text :

Public Property GridMessageText() As String 
 Get
 Return GridMessage.Text 
 End Get 
 Set(ByVal Value As String) 
 GridMessage.Text = Value 
 End Set 
End Property

Quando viene aggiunto un nuovo record alla tabella da una pagina di Products contenuto, RecentProducts GridView nella pagina master deve essere riassociato all'origine dati sottostante. Per riassociare GridView chiama il metodo DataBind . Poiché GridView nella pagina master non è accessibile a livello di codice alle pagine di contenuto, è necessario creare un metodo pubblico nella pagina master che, quando viene chiamato, riassocia i dati a GridView. Aggiungere il metodo seguente alla classe code-behind della pagina master:

Public Sub RefreshRecentProductsGrid() 
 RecentProducts.DataBind()
End Sub

Con la proprietà e RefreshRecentProductsGrid il GridMessageText metodo sul posto, qualsiasi pagina del contenuto può impostare o leggere il valore della GridMessage proprietà dell'etichetta Text o riassociare i dati a RecentProducts GridView. Il passaggio 4 esamina come accedere alle proprietà e ai metodi pubblici della pagina master da una pagina di contenuto.

Passaggio 4: Chiamata dei membri pubblici della pagina master da una pagina contenuto

Ora che la pagina master ha le proprietà e i metodi pubblici necessari, è possibile richiamare queste proprietà e metodi dalla pagina del AddProduct.aspx contenuto. In particolare, è necessario impostare la proprietà della GridMessageText pagina master e chiamarne RefreshRecentProductsGrid il metodo dopo che il nuovo prodotto è stato aggiunto al database. Tutti i controlli Web di ASP.NET dati generano eventi immediatamente prima e dopo il completamento di varie attività, semplificando agli sviluppatori di pagine di eseguire alcune azioni a livello di codice prima o dopo l'attività. Ad esempio, quando l'utente finale fa clic sul pulsante Inserisci di DetailsView, nel postback DetailsView genera l'evento ItemInserting prima di iniziare il flusso di lavoro di inserimento. Inserisce quindi il record nel database. In seguito, DetailsView genera l'evento ItemInserted . Pertanto, per lavorare con la pagina master dopo l'aggiunta del nuovo prodotto, creare un gestore eventi per l'evento detailsView ItemInserted .

Esistono due modi in cui una pagina del contenuto può interfacciarsi a livello di codice con la relativa pagina master:

• Utilizzando la Page.Master proprietà , che restituisce un riferimento di tipo libero alla pagina master o
• Specificare il tipo di pagina master o il percorso del file della pagina tramite una @MasterType direttiva. In questo modo viene aggiunta automaticamente una proprietà fortemente tipizzata alla pagina denominata Master.

Esaminiamo entrambi gli approcci.

Utilizzo della proprietà loosely-typedPage.Master

Tutte le pagine Web ASP.NET devono derivare dalla Page classe , che si trova nello spazio dei System.Web.UI nomi . La Page classe include una Master proprietà che restituisce un riferimento alla pagina master della pagina. Se la pagina non dispone di una pagina Master master restituisce Nothing.

La Master proprietà restituisce un oggetto di tipo MasterPage ,che si trova anche nello spazio dei System.Web.UI nomi , ovvero il tipo di base da cui derivano tutte le pagine master. Pertanto, per utilizzare proprietà o metodi pubblici definiti nella pagina master del sito Web, è necessario eseguire il cast dell'oggetto MasterPage restituito dalla Master proprietà al tipo appropriato. Poiché il file Site.masterdella pagina master è stato denominato , la classe code-behind è stata denominata Site. Di conseguenza, il codice seguente esegue il cast della Page.Master proprietà a un'istanza della Site classe .

' Cast the loosely-typed Page.Master property and then set the GridMessageText property 
Dim myMasterPage As Site = CType(Page.Master, Site)

Ora che è stato eseguito il cast della proprietà di tipo Page.Master libero sul tipo di sito, è possibile fare riferimento alle proprietà e ai metodi specifici di Site. Come illustrato nella figura 7, la proprietà GridMessageText pubblica viene visualizzata nell'elenco a discesa IntelliSense.

Figura 07: IntelliSense mostra le proprietà e i metodi pubblici della pagina master (fare clic per visualizzare l'immagine a dimensione intera)

Creazione di un riferimento fortemente tipizzato con la@MasterTypedirettiva

Se si osserva attentamente che la classe code-behind di una pagina ASP.NET è una classe parziale (si noti la Partial parola chiave nella definizione della classe). Le classi parziali sono state introdotte in C# e Visual Basic with.NET Framework 2.0 e, in poche parole, consentono di definire i membri di una classe in più file. Il file di classe code-behind, AddProduct.aspx.vbad esempio , contiene il codice creato dallo sviluppatore di pagine. Oltre al codice, il motore di ASP.NET crea automaticamente un file di classe separato con proprietà e gestori eventi in che convertono il markup dichiarativo nella gerarchia di classi della pagina.

La generazione automatica di codice che si verifica ogni volta che viene visitata una pagina ASP.NET apre la strada per alcune possibilità piuttosto interessanti e utili. Nel caso delle pagine master, se si indica al motore di ASP.NET quale pagina master viene usata dalla pagina del contenuto, viene generata una proprietà fortemente tipizzata Master .

Usare la @MasterType direttiva per informare il motore di ASP.NET del tipo di pagina master della pagina del contenuto. La @MasterType direttiva può accettare il nome del tipo della pagina master o il relativo percorso del file. Per specificare che la AddProduct.aspx pagina usa Site.master come pagina master, aggiungere la direttiva seguente all'inizio di AddProduct.aspx:

<%@ MasterType VirtualPath="~/Site.master" %>

Questa direttiva indica al motore di ASP.NET di aggiungere un riferimento fortemente tipizzato alla pagina master tramite una proprietà denominata Master. Con la @MasterType direttiva sul posto, è possibile chiamare le proprietà e i Site.master metodi pubblici della pagina master direttamente tramite la Master proprietà senza cast.

Aggiornamento della pagina master dopo l'aggiunta di un nuovo prodotto

Ora che sappiamo come richiamare le proprietà e i metodi pubblici di una pagina master da una pagina del contenuto, siamo pronti per aggiornare la pagina in modo che la AddProduct.aspx pagina master venga aggiornata dopo l'aggiunta di un nuovo prodotto. All'inizio del passaggio 4 è stato creato un gestore eventi per l'evento del ItemInserting controllo DetailsView, che viene eseguito immediatamente dopo l'aggiunta del nuovo prodotto al database. Aggiungere il codice seguente al gestore eventi:

Protected Sub NewProduct_ItemInserted(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DetailsViewInsertedEventArgs) Handles NewProduct.ItemInserted
 ' Cast the loosely-typed Page.Master property and then set the GridMessageText property 
 Dim myMasterPage As Site = CType(Page.Master, Site) 
 myMasterPage.GridMessageText = String.Format("{0} added to grid...", e.Values("ProductName"))
 ' Use the strongly-typed Master property 
 Master.RefreshRecentProductsGrid()
End Sub

Il codice precedente usa sia la proprietà di tipo Page.Master libero che la proprietà fortemente tipizzata Master . Si noti che la GridMessageText proprietà è impostata su "ProductName aggiunto alla griglia..." I valori del prodotto appena aggiunti sono accessibili tramite la e.Values raccolta. Come si può notare, il valore appena aggiunto ProductName è accessibile tramite e.Values("ProductName").

La figura 8 mostra la AddProduct.aspx pagina subito dopo l'aggiunta di un nuovo prodotto Scott's Soda al database. Si noti che il nome del prodotto appena aggiunto è indicato nell'etichetta della pagina master e che GridView è stato aggiornato per includere il prodotto e il relativo prezzo.

Figura 08: Etichetta della pagina master e GridView Mostra il prodotto appena aggiunto (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. Anche se le pagine master e le pagine di contenuto devono essere progettate tenendo presente tale obiettivo, esistono diversi scenari comuni in cui una pagina di contenuto deve interfacciarsi con la relativa pagina master. Uno dei motivi più comuni è incentrato sull'aggiornamento di una particolare parte della visualizzazione della pagina master in base a un'azione che si è trasparita nella pagina del contenuto.

La buona notizia è che è relativamente semplice avere una pagina di contenuto a livello di programmazione con la relativa pagina master. Per iniziare, creare proprietà o metodi pubblici nella pagina master che incapsulano le funzionalità che devono essere richiamate da una pagina di contenuto. Quindi, nella pagina del contenuto, accedere alle proprietà e ai metodi della pagina master tramite la proprietà di tipo libero o usare la @MasterType direttiva per creare un riferimento fortemente tipizzato Page.Master alla pagina master.

Nell'esercitazione successiva si esaminerà come interagire a livello di codice con una delle pagine di contenuto della pagina master.

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
• ASP.NET pagine master: suggerimenti, trucchi e trappole
• @MasterType in ASP.NET 2.0
• 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 Zack Jones. Si è interessati a esaminare i prossimi articoli MSDN? In tal caso, lasciami una riga in mitchell@4GuysFromRolla.com