Filtro master/dettaglio con un controllo DropDownList e GridView (C#)

di Scott Mitchell

Scarica il PDF

In questa esercitazione verrà illustrato come visualizzare i record master in un controllo DropDownList e i dettagli dell'elemento elenco selezionato in Un controllo GridView.

Introduzione

Un tipo comune di report è il report master/dettaglio, in cui il report inizia visualizzando alcuni set di record "master". L'utente può quindi eseguire il drill-down in uno dei record master, visualizzando così i "dettagli" del record master. I report master/dettagli sono una scelta ideale per visualizzare relazioni uno-a-molti, ad esempio un report che mostra tutte le categorie e quindi consentire a un utente di selezionare una determinata categoria e visualizzarne i prodotti associati. Inoltre, i report master/dettagli sono utili per visualizzare informazioni dettagliate da tabelle particolarmente "wide" (quelle con molte colonne). Ad esempio, il livello "master" di un report master/dettaglio potrebbe mostrare solo il nome del prodotto e il prezzo unitario dei prodotti nel database e il drill-down in un determinato prodotto mostrerebbe i campi di prodotto aggiuntivi (categoria, fornitore, quantità per unità e così via).

Esistono molti modi in cui è possibile implementare un report master/dettaglio. In questo modo e le tre esercitazioni successive verranno esaminate un'ampia gamma di report master/dettagli. In questa esercitazione verrà illustrato come visualizzare i record master in un controllo DropDownList e i dettagli dell'elemento elenco selezionato in Un controllo GridView. In particolare, il report master/dettagli dell'esercitazione elenca le informazioni sulla categoria e sul prodotto.

Passaggio 1: Visualizzazione delle categorie in un elenco a discesa

Il report master/dettaglio elenca le categorie in un elenco a discesa, con i prodotti dell'elenco selezionati visualizzati più avanti nella pagina in un oggetto GridView. La prima attività davanti a noi, quindi, consiste nell'avere le categorie visualizzate in un elenco a discesa. Aprire la FilterByDropDownList.aspx pagina nella Filtering cartella, trascinare in un elenco a discesa dalla casella degli strumenti nella finestra di progettazione della pagina e impostare la relativa ID proprietà su Categories. Fare quindi clic sul collegamento Scegli origine dati dallo smart tag di DropDownList. Verrà visualizzata la procedura guidata Configurazione origine dati.

Specificare l'origine dati di DropDownList

Figura 1: Specificare l'origine dati dell'elenco a discesa (fare clic per visualizzare l'immagine a dimensioni complete)

Scegliere di aggiungere un nuovo OggettoDataSource denominato CategoriesDataSource che richiama il CategoriesBLL metodo della GetCategories() classe.

Aggiungere un nuovo oggettoDataSource denominato CategoriesDataSource

Figura 2: Aggiungere un nuovo oggettoDataSource denominato CategoriesDataSource (fare clic per visualizzare l'immagine full-size)

Scegliere di usare la classe CategoriesBLL

Figura 3: Scegliere di usare la classe (fare clic per visualizzare l'immagineCategoriesBLL full-size)

Configurare ObjectDataSource per usare il metodo GetCategories()

Figura 4: Configurare ObjectDataSource per usare il metodo (fare clic per visualizzare l'immagineGetCategories() a dimensioni complete)

Dopo aver configurato ObjectDataSource, è comunque necessario specificare il campo origine dati da visualizzare in DropDownList e quale deve essere associato come valore per l'elemento di elenco. Avere il CategoryName campo come visualizzazione e CategoryID come valore per ogni elemento dell'elenco.

Visualizzare il campo CategoryName e usare CategoryID come valore

Figura 5: Visualizzare il CategoryName campo e usare CategoryID come valore (fare clic per visualizzare l'immagine a dimensioni complete)

A questo punto è disponibile un controllo DropDownList popolato con i record della Categories tabella (tutti eseguiti in circa sei secondi). La figura 6 mostra finora lo stato di avanzamento quando viene visualizzato tramite un browser.

Un Drop-Down Elenchi le categorie correnti

Figura 6: Drop-Down Elenchi le categorie correnti (fare clic per visualizzare l'immagine a dimensioni complete)

Passaggio 2: Aggiunta di GridView prodotti

Questo ultimo passaggio nel report master/dettaglio consiste nell'elencare i prodotti associati alla categoria selezionata. A tale scopo, aggiungere un oggetto GridView alla pagina e creare un nuovo oggetto ObjectDataSource denominato productsDataSource. Disporre del controllo per l'ull dei productsDataSource dati dal ProductsBLL metodo della GetProductsByCategoryID(categoryID) classe.

Selezionare il metodo GetProductsByCategoryID(categoryID)

Figura 7: Selezionare il metodo (Fare clic per visualizzare l'immagineGetProductsByCategoryID(categoryID) full-size)

Dopo aver scelto questo metodo, la procedura guidata ObjectDataSource richiede il valore per il parametro del categoryID metodo. Per usare il valore dell'elemento DropDownList selezionato categories impostare l'origine Parametro su Control e il ControlID su Categories.

Impostare il parametro categoryID sul valore dell'elenco a discesa Categorie

Figura 8: Impostare il parametro sul valore dell'elenco a discesa (fare clic per visualizzare l'immaginecategoryIDCategories full-size)

Per controllare lo stato di avanzamento in un browser, prendere un momento. Quando si visita per la prima volta la pagina, tali prodotti appartengono alla categoria selezionata (Bevande) vengono visualizzate (come illustrato nella figura 9), ma la modifica dell'elenco a discesa non aggiorna i dati. Questo perché un postback deve verificarsi per l'aggiornamento di GridView. Per eseguire questa operazione sono disponibili due opzioni (nessuna delle quali richiede la scrittura di codice):

  • Impostare la proprietà AutoPostBack della categoria DropDownList su True. (È possibile eseguire questa operazione controllando l'opzione Abilita autoPostBack nel smart tag di DropDownList). Verrà attivato un postback ogni volta che l'elemento selezionato di DropDownList viene modificato dall'utente. Pertanto, quando l'utente seleziona una nuova categoria da DropDownList un postback verrà aggiornato e GridView verrà aggiornato con i prodotti per la categoria appena selezionata. Questo è l'approccio usato in questa esercitazione.
  • Aggiungere un controllo Web Button accanto all'elenco a discesa. Impostare la proprietà Text su Aggiorna o su qualcosa di simile. Con questo approccio, l'utente dovrà selezionare una nuova categoria e quindi fare clic sul pulsante. Facendo clic sul pulsante verrà generato un postback e verrà aggiornato GridView per elencare tali prodotti della categoria selezionata.

Le cifre 9 e 10 illustrano il report master/dettaglio in azione.

Quando si visita per la prima volta la pagina, vengono visualizzati i prodotti bevande

Figura 9: quando si visita per la prima volta la pagina, vengono visualizzati i prodotti bevande (fare clic per visualizzare l'immagine full-size)

La selezione di un nuovo prodotto (produce) causa automaticamente un postback, l'aggiornamento di GridView

Figura 10: la selezione di un nuovo prodotto (produce) causa automaticamente un postback, l'aggiornamento di GridView (fare clic per visualizzare l'immagine full-size)

Aggiunta di un elemento elenco "-- Scegliere una categoria --"

Quando si visita per la prima volta la pagina, la FilterByDropDownList.aspx prima voce di elenco di DropDownList (Bevande) viene selezionata per impostazione predefinita, che mostra i prodotti di bevande in GridView. Anziché visualizzare i prodotti della prima categoria, potrebbe essere necessario selezionare un elemento DropDownList che indica qualcosa come "-- Scegliere una categoria --".

Per aggiungere un nuovo elemento di elenco all'elenco a discesa, passare alla Finestra Proprietà e fare clic sui puntini di sospensione nella Items proprietà. Aggiungere una nuova voce di elenco con "Text-- Scegliere una categoria --" e .Value-1

Aggiungere un oggetto - Scegliere una categoria - Elemento elenco

Figura 11: Aggiungere un oggetto - Scegliere una categoria - Elemento elenco (fare clic per visualizzare l'immagine a dimensioni complete)

In alternativa, è possibile aggiungere l'elemento di elenco aggiungendo il markup seguente all'elenco a discesa:

<asp:DropDownList ID="categories" runat="server"
    AutoPostBack="True" DataSourceID="categoriesDataSource"
    DataTextField="CategoryName" DataValueField="CategoryID"
    EnableViewState="False">
    <asp:ListItem Value="-1">
       -- Choose a Category --
    </asp:ListItem>
</asp:DropDownList>

Inoltre, è necessario impostare il controllo DropDownList su True perché quando le categorie sono associate all'elenco a discesa dell'oggetto ObjectDataSource sovrascriveranno gli elementi dell'elenco AppendDataBoundItems aggiunti manualmente se AppendDataBoundItems non è True.

Impostare la proprietà AppendDataBoundItems su True

Figura 12: Impostare la AppendDataBoundItems proprietà su True

Dopo queste modifiche, quando si visita la pagina l'opzione "-- Scegliere una categoria --" viene selezionata e non vengono visualizzati prodotti.

Nella pagina iniziale non vengono visualizzati prodotti

Figura 13: nella pagina iniziale non vengono visualizzati prodotti (fare clic per visualizzare l'immagine full-size)

Il motivo per cui non viene visualizzato alcun prodotto quando viene selezionato l'elemento di elenco "-- Scegliere una categoria --" è perché il relativo valore è -1 e non sono presenti prodotti nel database con un CategoryID oggetto .-1 Se si tratta del comportamento desiderato, a questo punto si sta facendo! Se, tuttavia, si desidera visualizzare tutte le categorie quando l'elemento di elenco "-- Scegli una categoria --" viene selezionato, tornare alla ProductsBLL classe e personalizzare il GetProductsByCategoryID(categoryID) metodo in modo che richiama il GetProducts() metodo se il parametro passato categoryID è minore di zero:

public Northwind.ProductsDataTable GetProductsByCategoryID(int categoryID)
{
    if (categoryID < 0)
        return GetProducts();
    else
        return Adapter.GetProductsByCategoryID(categoryID);
}

La tecnica usata qui è simile all'approccio usato per visualizzare tutti i fornitori nell'esercitazione Parametri dichiarativi , anche se per questo esempio viene usato un valore di -1 per indicare che tutti i record devono essere recuperati anziché null. Questo è dovuto al fatto che il categoryID parametro del GetProductsByCategoryID(categoryID) metodo prevede come valore intero passato, mentre nell'esercitazione Parametri dichiarativi è stato passato un parametro di input stringa.

La figura 14 mostra una schermata di FilterByDropDownList.aspx quando è selezionata l'opzione "-- Scegliere una categoria --". In questo caso, tutti i prodotti vengono visualizzati per impostazione predefinita e l'utente può restringere la visualizzazione scegliendo una categoria specifica.

Tutti i prodotti sono ora elencati per impostazione predefinita

Figura 14: Tutti i prodotti sono ora elencati per impostazione predefinita (fare clic per visualizzare l'immagine a dimensioni complete)

Riepilogo

Quando si visualizzano dati gerarchicamente correlati, spesso consente di presentare i dati usando report master/dettagli, da cui l'utente può iniziare a usare i dati dall'inizio della gerarchia e eseguire il drill-down in dettagli. In questa esercitazione è stata esaminata la creazione di un report master/dettaglio semplice che mostra i prodotti di una categoria selezionata. Questa operazione è stata eseguita usando un elenco a discesa per l'elenco di categorie e un controllo GridView per i prodotti appartenenti alla categoria selezionata.

Nell'esercitazione successiva si eseguirà l'interfaccia DropDownList un passaggio ulteriore, usando due DropDownLists.

Programmazione felice!

Informazioni sull'autore

Scott Mitchell, autore di sette libri ASP/ASP.NET e fondatore di 4GuysFromRolla.com, ha lavorato con le tecnologie Microsoft Web dal 1998. Scott lavora come consulente indipendente, allenatore e scrittore. Il suo ultimo libro è Sams Teach Yourself ASP.NET 2,0 in 24 Ore. Può essere raggiunto a mitchell@4GuysFromRolla.com. o tramite il suo blog, che può essere trovato in http://ScottOnWriting.NET.