Aggiunta e risposta ai pulsanti in un controllo GridView (VB)
In questa esercitazione verrà illustrato come aggiungere pulsanti personalizzati, sia a un modello che ai campi di un controllo GridView o DetailsView. In particolare, si creerà un'interfaccia con FormView che consente all'utente di paginare tramite i fornitori.
Introduzione
Sebbene molti scenari di creazione di report includano l'accesso in sola lettura ai dati del report, non è raro che i report includano la possibilità di eseguire azioni in base ai dati visualizzati. In genere, ciò comporta l'aggiunta di un controllo Web Button, LinkButton o ImageButton con ogni record visualizzato nel report che, quando è stato fatto clic, causa un postback e richiama un codice lato server. La modifica e l'eliminazione dei dati su base record è l'esempio più comune. Infatti, come abbiamo visto a partire dall'esercitazione Panoramica di inserimento, aggiornamento ed eliminazione dei dati , la modifica e l'eliminazione di dati è così comune che i controlli GridView, DetailsView e FormView possono supportare tali funzionalità senza la necessità di scrivere una singola riga di codice.
Oltre ai pulsanti Modifica ed eliminazione, i controlli GridView, DetailsView e FormView possono includere anche pulsanti, LinkButtons o ImageButtons che, quando si fa clic, eseguono una logica sul lato server personalizzata. In questa esercitazione verrà illustrato come aggiungere pulsanti personalizzati, sia a un modello che ai campi di un controllo GridView o DetailsView. In particolare, si creerà un'interfaccia con FormView che consente all'utente di paginare tramite i fornitori. Per un determinato fornitore, FormView mostrerà informazioni sul fornitore insieme a un controllo Web Button che, se fatto clic, contrassegnerà tutti i prodotti associati come interrotti. Inoltre, un controllo GridView elenca i prodotti forniti dal fornitore selezionato, con ogni riga contenente i pulsanti aumenta prezzo e prezzo sconto che, se è stato fatto clic, aumentare o ridurre il prodotto UnitPrice per il 10% (vedere la figura 1).
Figura 1: Sia FormView che GridView contengono pulsanti che eseguono azioni personalizzate (fare clic per visualizzare l'immagine full-size)
Passaggio 1: Aggiunta delle pagine Web dell'esercitazione sul pulsante
Prima di esaminare come aggiungere un pulsante personalizzato, è prima necessario creare le pagine di ASP.NET nel progetto del sito Web necessarie per questa esercitazione. Iniziare aggiungendo una nuova cartella denominata CustomButtons. Aggiungere quindi le due pagine seguenti ASP.NET a tale cartella, assicurandosi di associare ogni pagina alla Site.master pagina master:
Default.aspxCustomButtons.aspx
Figura 2: Aggiungere le pagine ASP.NET per le esercitazioni di Buttons-Related personalizzate
Come nelle altre cartelle, Default.aspx nella CustomButtons cartella verranno elencate le esercitazioni nella relativa sezione. Tenere presente che il SectionLevelTutorialListing.ascx controllo utente fornisce questa funzionalità. Aggiungere quindi questo controllo utente a Default.aspx trascinandolo dalla Esplora soluzioni nella visualizzazione Progettazione della pagina.
Figura 3: Aggiungere il controllo utente a Default.aspx (Fare clic per visualizzare l'immagineSectionLevelTutorialListing.ascx full-size)
Infine, aggiungere le pagine come voci al Web.sitemap file. In particolare, aggiungere il markup seguente dopo il paging <siteMapNode>e l'ordinamento :
<siteMapNode
title="Adding Custom Buttons"
description="Samples of Reports that Include Buttons for Performing
Server-Side Actions"
url="~/CustomButtons/Default.aspx">
<siteMapNode
title="Using ButtonFields and Buttons in Templates"
description="Examines how to add custom Buttons, LinkButtons,
or ImageButtons as ButtonFields or within templates."
url="~/CustomButtons/CustomButtons.aspx" />
</siteMapNode>
Dopo l'aggiornamento Web.sitemap, passare un momento per visualizzare il sito Web delle esercitazioni tramite un browser. Il menu a sinistra include ora elementi per la modifica, l'inserimento e l'eliminazione di esercitazioni.
Figura 4: La mappa del sito include ora la voce per l'esercitazione sui pulsanti personalizzati
Passaggio 2: Aggiunta di formView che Elenchi i fornitori
Introduzione a questa esercitazione aggiungendo FormView che elenca i fornitori. Come illustrato nell'introduzione, questo FormView consentirà all'utente di passare attraverso i fornitori, mostrando i prodotti forniti dal fornitore in un controllo GridView. Inoltre, questo FormView includerà un pulsante che, quando fatto clic, contrassegnerà tutti i prodotti del fornitore come interrotti. Prima di preoccuparsi dell'aggiunta del pulsante personalizzato a FormView, è prima possibile creare FormView in modo che visualizzi le informazioni sul fornitore.
Iniziare aprendo la CustomButtons.aspx pagina nella CustomButtons cartella. Aggiungere un Oggetto FormView alla pagina trascinandolo dalla casella degli strumenti nella Designer e impostarne la ID proprietà su Suppliers. Dallo smart tag di FormView scegliere di creare un nuovo oggetto ObjectDataSource denominato SuppliersDataSource.
Figura 5: Creare un nuovo oggettoDataSource denominato SuppliersDataSource (fare clic per visualizzare l'immagine a dimensioni complete)
Configurare questo nuovo oggetto ObjectDataSource in modo che venga eseguita una query dal SuppliersBLL metodo della GetSuppliers() classe (vedere la figura 6). Poiché FormView non fornisce un'interfaccia per aggiornare le informazioni sul fornitore, selezionare l'opzione (Nessuno) nell'elenco a discesa nella scheda UPDATE.
Figura 6: Configurare l'origine dati per usare il metodo della GetSuppliers() classe (fare clic per visualizzare l'immagineSuppliersBLL full-size)
Dopo aver configurato ObjectDataSource, Visual Studio genererà un InsertItemTemplateoggetto , EditItemTemplatee ItemTemplate per FormView. Rimuovere e modificare l'oggetto InsertItemTemplateEditItemTemplateItemTemplate in modo che visualizzi solo il nome e il numero di telefono del fornitore. Infine, attivare il supporto per il paging per FormView selezionando la casella di controllo Abilita paging dal relativo smart tag (o impostandone la AllowPaging proprietà su True). Dopo queste modifiche, il markup dichiarativo della pagina dovrebbe essere simile al seguente:
<asp:FormView ID="Suppliers" runat="server" DataKeyNames="SupplierID"
DataSourceID="SuppliersDataSource" EnableViewState="False" AllowPaging="True">
<ItemTemplate>
<h3>
<asp:Label ID="CompanyName" runat="server"
Text='<%# Bind("CompanyName") %>' />
</h3>
<b>Phone:</b>
<asp:Label ID="PhoneLabel" runat="server" Text='<%# Bind("Phone") %>' />
</ItemTemplate>
</asp:FormView>
<asp:ObjectDataSource ID="SuppliersDataSource" runat="server"
OldValuesParameterFormatString="original_{0}"
SelectMethod="GetSuppliers" TypeName="SuppliersBLL">
</asp:ObjectDataSource>
La figura 7 mostra la pagina CustomButtons.aspx quando visualizzata tramite un browser.
Figura 7: FormView Elenchi i CompanyName campi e Phone dal fornitore attualmente selezionato (fare clic per visualizzare l'immagine full-size)
Passaggio 3: Aggiunta di gridView che Elenchi i prodotti del fornitore selezionati
Prima di aggiungere il pulsante Discontinue All Products al modello di FormView, è prima possibile aggiungere un controllo GridView sotto FormView che elenca i prodotti forniti dal fornitore selezionato. A questo scopo, aggiungere un oggetto GridView alla pagina, impostare la relativa ID proprietà su SuppliersProductse aggiungere un nuovo oggetto ObjectDataSource denominato SuppliersProductsDataSource.
Figura 8: Creare un nuovo oggettoDataSource denominato SuppliersProductsDataSource (fare clic per visualizzare l'immagine a dimensioni complete)
Configurare ObjectDataSource per usare il metodo della GetProductsBySupplierID(supplierID) classe ProductsBLL (vedere la figura 9). Anche se gridView consente di regolare il prezzo di un prodotto, non verrà usato la modifica predefinita o l'eliminazione di funzionalità da GridView. È pertanto possibile impostare l'elenco a discesa su (Nessuno) per le schede UPDATE, INSERT e DELETE di ObjectDataSource.
Figura 9: Configurare l'origine dati per usare il metodo della GetProductsBySupplierID(supplierID) classe (fare clic per visualizzare l'immagineProductsBLL full-size)
Poiché il metodo accetta un parametro di input, la GetProductsBySupplierID(supplierID) procedura guidata ObjectDataSource richiede l'origine di questo valore di parametro. Per passare il SupplierID valore da FormView, impostare l'elenco a discesa Origine parametri su Control e l'elenco a discesa ControlID su Suppliers (ID dell'oggetto FormView creato nel passaggio 2).
Figura 10: indicare che il supplierID parametro deve venire dal controllo FormView (fare clic per visualizzare l'immagineSuppliers full-size)
Al termine della procedura guidata ObjectDataSource, GridView conterrà un oggetto BoundField o CheckBoxField per ognuno dei campi dati del prodotto. Consente di tagliare questo valore per visualizzare solo i ProductName campi e UnitPrice BoundField insieme Discontinued a CheckBoxField. Inoltre, formattare il BoundField in modo che il UnitPrice testo sia formattato come valuta. Il markup dichiarativo gridView e SuppliersProductsDataSource ObjectDataSource deve essere simile al markup seguente:
<asp:GridView ID="SuppliersProducts" AutoGenerateColumns="False"
DataKeyNames="ProductID" DataSourceID="SuppliersProductsDataSource"
EnableViewState="False" runat="server">
<Columns>
<asp:BoundField DataField="ProductName" HeaderText="Product"
SortExpression="ProductName" />
<asp:BoundField DataField="UnitPrice" HeaderText="Price"
SortExpression="UnitPrice" DataFormatString="{0:C}"
HtmlEncode="False" />
<asp:CheckBoxField DataField="Discontinued" HeaderText="Discontinued"
SortExpression="Discontinued" />
</Columns>
</asp:GridView>
<asp:ObjectDataSource ID="SuppliersProductsDataSource" runat="server"
OldValuesParameterFormatString="original_{0}"
SelectMethod="GetProductsBySupplierID" TypeName="ProductsBLL">
<SelectParameters>
<asp:ControlParameter ControlID="Suppliers" Name="supplierID"
PropertyName="SelectedValue" Type="Int32" />
</SelectParameters>
</asp:ObjectDataSource>
A questo punto l'esercitazione visualizza un report master/dettagli che consente all'utente di selezionare un fornitore da FormView nella parte superiore e di visualizzare i prodotti forniti da tale fornitore tramite GridView nella parte inferiore. La figura 11 mostra una schermata di questa pagina quando si seleziona il fornitore Tokyo Traders da FormView.
Figura 11: i prodotti del fornitore selezionati vengono visualizzati in GridView (Fare clic per visualizzare l'immagine full-size)
Passaggio 4: Creazione di metodi DAL e BLL per interrompere tutti i prodotti per un fornitore
Prima di poter aggiungere un pulsante a FormView che, quando fatto clic, interrompe tutti i prodotti del fornitore, è prima necessario aggiungere un metodo sia al DAL che al BLL che esegue questa azione. In particolare, questo metodo verrà denominato DiscontinueAllProductsForSupplier(supplierID). Quando si fa clic sul pulsante di FormView, verrà richiamato questo metodo nel livello della logica di business, passando il fornitore selezionato. Il valore BLL verrà quindi richiamato al metodo livello di accesso ai dati corrispondente, che emetterà un'istruzione UPDATE al database che interrompe i prodotti del fornitore SupplierIDspecificati.
Come abbiamo fatto nelle esercitazioni precedenti, verrà usato un approccio in basso, a partire dalla creazione del metodo DAL, quindi dal metodo BLL e infine dall'implementazione della funzionalità nella pagina ASP.NET. Aprire Typed DataSet nella cartella e aggiungere un nuovo metodo all'oggetto ProductsTableAdapterProductsTableAdapter (fare clic con il Northwind.xsd pulsante destro del App_Code/DAL mouse su e scegliere Aggiungi query). In questo modo verrà visualizzata la Procedura guidata Di configurazione query TableAdapter, che illustra il processo di aggiunta del nuovo metodo. Iniziare indicando che il metodo DAL userà un'istruzione SQL ad hoc.
Figura 12: Creare il metodo DAL usando un'istruzione SQL ad hoc (fare clic per visualizzare l'immagine full-size)
Successivamente, la procedura guidata richiede il tipo di query da creare. Poiché il DiscontinueAllProductsForSupplier(supplierID) metodo dovrà aggiornare la Products tabella di database, impostare il Discontinued campo su 1 per tutti i prodotti forniti dall'oggetto specificato supplierID, è necessario creare una query che aggiorna i dati.
Figura 13: scegliere il tipo di query UPDATE (Fare clic per visualizzare l'immagine full-size)
La schermata della procedura guidata successiva fornisce l'istruzione esistente UPDATE tableAdapter, che aggiorna ognuno dei campi definiti in Products DataTable. Sostituire il testo della query con l'istruzione seguente:
UPDATE [Products] SET
Discontinued = 1
WHERE SupplierID = @SupplierID
Dopo aver immesso questa query e facendo clic su Avanti, l'ultima schermata della procedura guidata chiede il nome del nuovo metodo usa DiscontinueAllProductsForSupplier. Completare la procedura guidata facendo clic sul pulsante Fine. Dopo aver restituito al dataset Designer dovrebbe essere visualizzato un nuovo metodo nell'oggetto ProductsTableAdapter denominato DiscontinueAllProductsForSupplier(@SupplierID).
Figura 14: Assegnare un nome al nuovo metodo DiscontinueAllProductsForSupplier DAL (fare clic per visualizzare l'immagine a dimensione intera)
Con il DiscontinueAllProductsForSupplier(supplierID) metodo creato nel livello di accesso ai dati, l'attività successiva consiste nel creare il DiscontinueAllProductsForSupplier(supplierID) metodo nel livello della logica di business. A tale scopo, aprire il file di ProductsBLL classe e aggiungere quanto segue:
Public Function DiscontinueAllProductsForSupplier(supplierID As Integer) As Integer
Return Adapter.DiscontinueAllProductsForSupplier(supplierID)
End Function
Questo metodo chiama semplicemente il DiscontinueAllProductsForSupplier(supplierID) metodo in DAL, passando il valore del parametro specificato supplierID . Se ci sono regole di business che consentivano l'interruzione dei prodotti di un fornitore solo in determinate circostanze, tali regole dovrebbero essere implementate nel BLL.
Nota
A differenza degli UpdateProduct overload nella classe , la DiscontinueAllProductsForSupplier(supplierID) firma del ProductsBLL metodo non include l'attributo DataObjectMethodAttribute (<System.ComponentModel.DataObjectMethodAttribute(System.ComponentModel.DataObjectMethodType.Update, Boolean)>). Ciò impedisce il DiscontinueAllProductsForSupplier(supplierID) metodo dall'elenco a discesa Configura origine dati della procedura guidata ObjectDataSource nella scheda UPDATE. Ho omesso questo attributo perché chiameremo il DiscontinueAllProductsForSupplier(supplierID) metodo direttamente da un gestore eventi nella pagina ASP.NET.
Passaggio 5: Aggiunta di un pulsante Interrompi tutti i prodotti a FormView
Al termine del DiscontinueAllProductsForSupplier(supplierID) metodo in BLL e DAL, il passaggio finale per aggiungere la possibilità di interrompere tutti i prodotti per il fornitore selezionato consiste nell'aggiungere un controllo Web Button a FormView s ItemTemplate. Aggiungere un pulsante di questo tipo sotto il numero di telefono del fornitore con il testo del pulsante, Discontinue All Products e il ID valore della DiscontinueAllProductsForSupplierproprietà . È possibile aggiungere questo controllo Web Button tramite il Designer facendo clic sul collegamento Modifica modelli nello smart tag formView (vedere la figura 15) o direttamente tramite la sintassi dichiarativa.
Figura 15: Aggiungere un controllo Web Per tutti i prodotti non più aggiornati a FormView (ItemTemplatefare clic per visualizzare l'immagine a dimensione intera)
Quando si fa clic sul pulsante da un utente che visita la pagina, viene generato un postback e viene generato l'evento formView.ItemCommand Per eseguire codice personalizzato in risposta a questo pulsante selezionato, è possibile creare un gestore eventi per questo evento. Comprendere, tuttavia, che l'evento ItemCommand viene generato ogni volta che viene fatto clic su qualsiasi controllo Web Button, LinkButton o ImageButton all'interno di FormView. Ciò significa che quando l'utente passa da una pagina a un'altra in FormView, l'evento ItemCommand viene generato; la stessa cosa quando l'utente fa clic su Nuovo, Modifica o Elimina in un controllo FormView che supporta l'inserimento, l'aggiornamento o l'eliminazione.
Poiché il ItemCommand pulsante viene attivato indipendentemente dal pulsante selezionato, nel gestore eventi è necessario un modo per determinare se è stato fatto clic sul pulsante Discontinue All Products o se si tratta di un altro pulsante. A tale scopo, è possibile impostare la proprietà del CommandName controllo Web Button su un valore di identificazione. Quando si fa clic su Button, questo CommandName valore viene passato al ItemCommand gestore eventi, consentendoci di determinare se il pulsante Discontinue All Products è stato selezionato. Impostare la proprietà Discontinue All Products Button su CommandName DiscontinueProducts .
Infine, è possibile usare una finestra di dialogo di conferma sul lato client per assicurarsi che l'utente voglia effettivamente interrompere i prodotti del fornitore selezionato. Come illustrato nell'esercitazione Aggiunta di Client-Side conferma durante l'eliminazione , questa operazione può essere eseguita con un po'di JavaScript. In particolare, impostare la proprietà OnClientClick del controllo Web Button su return confirm('This will mark _all_ of this supplier\'s products as discontinued. Are you certain you want to do this?');
Dopo aver apportato queste modifiche, la sintassi dichiarativa di FormView dovrebbe essere simile alla seguente:
<asp:FormView ID="Suppliers" runat="server" DataKeyNames="SupplierID"
DataSourceID="SuppliersDataSource" EnableViewState="False"
AllowPaging="True">
<ItemTemplate>
<h3><asp:Label ID="CompanyName" runat="server"
Text='<%# Bind("CompanyName") %>'></asp:Label></h3>
<b>Phone:</b>
<asp:Label ID="PhoneLabel" runat="server" Text='<%# Bind("Phone") %>' />
<br />
<asp:Button ID="DiscontinueAllProductsForSupplier" runat="server"
CommandName="DiscontinueProducts" Text="Discontinue All Products"
OnClientClick="return confirm('This will mark _all_ of this supplier\'s
products as discontinued. Are you certain you want to do this?');" />
</ItemTemplate>
</asp:FormView>
Creare quindi un gestore eventi per l'evento FormView.ItemCommand In questo gestore eventi è necessario innanzitutto determinare se è stato fatto clic sul pulsante Discontinue All Products .In this event handler we need to first determine the Discontinue All Products Button was clicked. In tal caso, si vuole creare un'istanza della classe e richiamarne DiscontinueAllProductsForSupplier(supplierID) il ProductsBLL metodo, passando l'oggetto dell'oggetto SupplierID FormView selezionato:
Protected Sub Suppliers_ItemCommand(sender As Object, e As FormViewCommandEventArgs) _
Handles Suppliers.ItemCommand
If e.CommandName.CompareTo("DiscontinueProducts") = 0 Then
' The "Discontinue All Products" Button was clicked.
' Invoke the ProductsBLL.DiscontinueAllProductsForSupplier(supplierID) method
' First, get the SupplierID selected in the FormView
Dim supplierID As Integer = CType(Suppliers.SelectedValue, Integer)
' Next, create an instance of the ProductsBLL class
Dim productInfo As New ProductsBLL()
' Finally, invoke the DiscontinueAllProductsForSupplier(supplierID) method
productInfo.DiscontinueAllProductsForSupplier(supplierID)
End If
End Sub
Si noti che è possibile accedere all'oggetto SupplierID del fornitore selezionato corrente in FormView usando la proprietà formView.SelectedValue La SelectedValue proprietà restituisce il primo valore della chiave dati per il record visualizzato in FormView. La proprietà di DataKeyNamesFormView, che indica i campi dati da cui vengono estratti i valori della chiave dati, è stato automaticamente impostato su SupplierID da Visual Studio quando si associa ObjectDataSource a FormView nel passaggio 2.
Dopo aver creato il ItemCommand gestore eventi, provare la pagina. Passa al fornitore Cooperativa de Quesos 'Las Cabras' (è il quinto fornitore in FormView per me). Questo fornitore fornisce due prodotti, Queso Cabrales e Queso Manchego La Pastora, entrambi non sospesi.
Si supponga che la Cooperativa de Quesos 'Las Cabras' sia uscita dal mercato e quindi i suoi prodotti siano sospesi. Fare clic sul pulsante Interrompi tutti i prodotti. Verrà visualizzata la finestra di dialogo di conferma sul lato client (vedere la figura 16).
Figura 16: Cooperativa de Quesos Las Cabras Fornisce due prodotti attivi (fare clic per visualizzare l'immagine a dimensione intera)
Se si fa clic su OK nella finestra di dialogo di conferma sul lato client, l'invio del modulo procederà, causando un postback in cui verrà generato l'evento formView ItemCommand . Il gestore eventi creato verrà quindi eseguito, richiamando il DiscontinueAllProductsForSupplier(supplierID) metodo e interrompendo sia i prodotti Queso Cabrales che Queso Manchego La Pastora.
Se lo stato di visualizzazione di GridView è stato disabilitato, GridView viene rimbalzato nell'archivio dati sottostante in ogni postback e quindi verrà immediatamente aggiornato in modo da riflettere che questi due prodotti sono ora sospesi (vedere la figura 17). Se, tuttavia, non è stato disabilitato lo stato di visualizzazione in GridView, sarà necessario riassociare manualmente i dati a GridView dopo aver apportato questa modifica. A tale scopo, è sufficiente effettuare una chiamata al metodo gridView DataBind() immediatamente dopo aver richiamato il DiscontinueAllProductsForSupplier(supplierID) metodo .
Figura 17: Dopo aver fatto clic sul pulsante Interrompi tutti i prodotti, i prodotti del fornitore vengono aggiornati di conseguenza (fare clic per visualizzare l'immagine a dimensione intera)
Passaggio 6: Creazione di un overload updateProduct nel livello della logica di business per la regolazione del prezzo di un prodotto
Come per il pulsante Interrompi tutti i prodotti in FormView, per aggiungere pulsanti per aumentare e diminuire il prezzo di un prodotto in GridView, è necessario prima aggiungere i metodi appropriati livello di accesso ai dati e livello di logica di business. Poiché è già disponibile un metodo che aggiorna una singola riga di prodotto in DAL, è possibile fornire tali funzionalità creando un nuovo overload per il UpdateProduct metodo nel BLL.
Gli overload precedenti UpdateProduct hanno preso in alcune combinazioni di campi di prodotto come valori di input scalari e hanno quindi aggiornato solo questi campi per il prodotto specificato. Per questo overload si variano leggermente da questo standard e invece passare il prodotto s ProductID e la percentuale in base alla quale regolare ( UnitPrice invece di passare il nuovo, modificato UnitPrice stesso). Questo approccio semplifica il codice che è necessario scrivere nella classe code-behind della tabella ASP.NET, perché non è necessario preoccuparsi di determinare il prodotto corrente.UnitPrice
L'overload UpdateProduct per questa esercitazione è illustrato di seguito:
Public Function UpdateProduct _
(unitPriceAdjustmentPercentage As Decimal, productID As Integer) As Boolean
Dim products As Northwind.ProductsDataTable = Adapter.GetProductByProductID(productID)
If products.Count = 0 Then
' no matching record found, return false
Return False
End If
Dim product As Northwind.ProductsRow = products(0)
' Adjust the UnitPrice by the specified percentage (if it's not NULL)
If Not product.IsUnitPriceNull() Then
product.UnitPrice *= unitPriceAdjustmentPercentage
End If
' Update the product record
Dim rowsAffected As Integer = Adapter.Update(product)
' Return true if precisely one row was updated, otherwise false
Return rowsAffected = 1
End Function
Questo overload recupera informazioni sul prodotto specificato tramite il metodo dal GetProductByProductID(productID) . Verifica quindi se al prodotto UnitPrice viene assegnato un valore di database NULL . In caso affermativo, il prezzo rimane invariato. Se, tuttavia, esiste un valore diversoNULLUnitPrice , il metodo aggiorna il prodotto UnitPrice in base alla percentuale specificata (unitPriceAdjustmentPercent).
Passaggio 7: Aggiunta dei pulsanti Aumenta e Riduci a GridView
GridView (e DetailsView) sono entrambi costituiti da una raccolta di campi. Oltre a BoundFields, CheckBoxFields e TemplateFields, ASP.NET include ButtonField, che, come suggerisce il nome, esegue il rendering come colonna con un controllo Button, LinkButton o ImageButton per ogni riga. Analogamente a FormView, facendo clic su qualsiasi pulsante all'interno dei pulsanti di paging di GridView, Modifica o Elimina, i pulsanti di ordinamento e così via provoca un postback e genera l'evento gridView.RowCommand
ButtonField ha una CommandName proprietà che assegna il valore specificato a ognuna delle relative proprietà Buttons CommandName . Analogamente a FormView, il CommandName valore viene usato dal RowCommand gestore eventi per determinare quale pulsante è stato fatto clic.
Aggiungi due nuovi Campi ButtonField a GridView, uno con un testo pulsante Price +10% e l'altro con il testo Price -10%. Per aggiungere questi campi ButtonField, fare clic sul collegamento Modifica colonne dallo smart tag di GridView, selezionare il tipo di campo ButtonField dall'elenco in alto a sinistra e fare clic sul pulsante Aggiungi.
Figura 18: Aggiungere due campi pulsante a GridView
Spostare i due campi ButtonField in modo che vengano visualizzati come primi due campi GridView. Impostare quindi le Text proprietà di questi due campi ButtonFields su Price +10% e Price -10% e le CommandName proprietà rispettivamente su IncreasePrice e DecreasePrice. Per impostazione predefinita, buttonField esegue il rendering della relativa colonna di pulsanti come LinkButtons. Questa modifica può tuttavia essere modificata tramite la proprietà ButtonField.ButtonType Let s have these two ButtonFields renderd as regular push button; impostare quindi la ButtonType proprietà su Button. La figura 19 mostra la finestra di dialogo Campi dopo aver apportato queste modifiche; di seguito è riportato il markup dichiarativo di GridView.
Figura 19: Configurare le proprietà ButtonFields Text, CommandNamee ButtonType
<asp:GridView ID="SuppliersProducts" runat="server" AutoGenerateColumns="False"
DataKeyNames="ProductID" DataSourceID="SuppliersProductsDataSource"
EnableViewState="False">
<Columns>
<asp:ButtonField ButtonType="Button" CommandName="IncreasePrice"
Text="Price +10%" />
<asp:ButtonField ButtonType="Button" CommandName="DecreasePrice"
Text="Price -10%" />
<asp:BoundField DataField="ProductName" HeaderText="Product"
SortExpression="ProductName" />
<asp:BoundField DataField="UnitPrice" HeaderText="Price"
SortExpression="UnitPrice" DataFormatString="{0:C}"
HtmlEncode="False" />
<asp:CheckBoxField DataField="Discontinued" HeaderText="Discontinued"
SortExpression="Discontinued" />
</Columns>
</asp:GridView>
Dopo aver creato questi ButtonFields, il passaggio finale consiste nel creare un gestore eventi per l'evento gridView.RowCommand Questo gestore eventi, se attivato perché sono stati cliccati i pulsanti Price +10% o Price -10%, deve determinare l'oggetto ProductID per la riga su cui è stato fatto clic sul pulsante e quindi richiamare il ProductsBLL metodo della UpdateProduct classe, passando la regolazione percentuale appropriata UnitPrice insieme a ProductID. Il codice seguente esegue queste attività:
Protected Sub SuppliersProducts_RowCommand _
(sender As Object, e As GridViewCommandEventArgs) _
Handles SuppliersProducts.RowCommand
If e.CommandName.CompareTo("IncreasePrice") = 0 OrElse _
e.CommandName.CompareTo("DecreasePrice") = 0 Then
' The Increase Price or Decrease Price Button has been clicked
' Determine the ID of the product whose price was adjusted
Dim productID As Integer = Convert.ToInt32( _
SuppliersProducts.DataKeys(Convert.ToInt32(e.CommandArgument)).Value)
' Determine how much to adjust the price
Dim percentageAdjust As Decimal
If e.CommandName.CompareTo("IncreasePrice") = 0 Then
percentageAdjust = 1.1
Else
percentageAdjust = 0.9
End If
' Adjust the price
Dim productInfo As New ProductsBLL()
productInfo.UpdateProduct(percentageAdjust, productID)
End If
End Sub
Per determinare per ProductID la riga su cui è stato fatto clic sul pulsante Price +10% o Price -10%, è necessario consultare la raccolta di DataKeys GridView. Questa raccolta contiene i valori dei campi specificati nella DataKeyNames proprietà per ogni riga gridView. Poiché la proprietà di GridView è DataKeyNames stata impostata su ProductID da Visual Studio quando si associa ObjectDataSource a GridView, DataKeys(rowIndex).Value fornisce per ProductID l'oggetto rowIndex specificato.
ButtonField passa automaticamente nella rigaIndex della riga il cui pulsante è stato fatto clic tramite il e.CommandArgument parametro . Pertanto, per determinare per la ProductID riga il cui pulsante Price +10% o Price -10% è stato selezionato, viene usato: Convert.ToInt32(SuppliersProducts.DataKeys(Convert.ToInt32(e.CommandArgument)).Value).
Come per il pulsante Interrompi tutti i prodotti, se è stato disabilitato lo stato di visualizzazione di GridView, GridView viene rebound all'archivio dati sottostante in ogni postback e quindi verrà immediatamente aggiornato in modo da riflettere una modifica del prezzo che si verifica facendo clic su uno dei pulsanti. Se, tuttavia, non è stato disabilitato lo stato di visualizzazione in GridView, sarà necessario riassociare manualmente i dati a GridView dopo aver apportato questa modifica. A tale scopo, è sufficiente effettuare una chiamata al metodo gridView DataBind() immediatamente dopo aver richiamato il UpdateProduct metodo .
La figura 20 mostra la pagina quando si visualizzano i prodotti forniti da Nonna Kelly's Homestead. La figura 21 mostra i risultati dopo che il pulsante Price +10% è stato fatto clic due volte per La nonna Boysenberry Spread e il pulsante Price -10% una volta per Northwoods Cranberry Sauce.
Figura 20: GridView include il prezzo +10% e il prezzo -10% pulsanti (fare clic per visualizzare l'immagine a dimensione intera)
Figura 21: I prezzi per il primo e il terzo prodotto sono stati aggiornati tramite i pulsanti Prezzo +10% e Prezzo -10% (fare clic per visualizzare l'immagine a dimensione intera)
Nota
GridView (e DetailsView) può anche avere pulsanti, linkbutton o imageButton aggiunti ai relativi campi template. Come per BoundField, questi pulsanti, quando si fa clic, genereranno un postback, generando l'evento gridView.RowCommand Quando si aggiungono pulsanti in un oggetto TemplateField, tuttavia, l'oggetto Button s CommandArgument non viene impostato automaticamente sull'indice della riga così com'è quando si utilizza ButtonFields. Se è necessario determinare l'indice di riga del pulsante su cui è stato fatto clic all'interno del RowCommand gestore eventi, è necessario impostare manualmente la proprietà Button s CommandArgument nella relativa sintassi dichiarativa all'interno di TemplateField, usando codice simile al seguente:
<asp:Button runat="server" ... CommandArgument='<%# CType(Container, GridViewRow).RowIndex %>' />.
Riepilogo
I controlli GridView, DetailsView e FormView possono includere pulsanti, linkbutton o imagebutton. Tali pulsanti, quando si fa clic, generano un postback e generano l'evento ItemCommand nei controlli FormView e DetailsView e l'evento RowCommand in GridView. Questi controlli Web dati dispongono di funzionalità predefinite per gestire azioni comuni correlate ai comandi, ad esempio l'eliminazione o la modifica di record. Tuttavia, è anche possibile usare pulsanti che, quando si fa clic, rispondono con l'esecuzione di codice personalizzato.
A tale scopo, è necessario creare un gestore eventi per l'evento ItemCommand o RowCommand . In questo gestore eventi si controlla innanzitutto il valore in ingresso CommandName per determinare quale pulsante è stato fatto clic e quindi eseguire un'azione personalizzata appropriata. In questa esercitazione è stato illustrato come usare pulsanti e ButtonFields per interrompere tutti i prodotti per un fornitore specificato o per aumentare o diminuire il prezzo di un determinato prodotto del 10%.
Buon programmatori!
Informazioni sull'autore
Scott Mitchell, autore di sette libri ASP/ASP.NET e fondatore di 4GuysFromRolla.com, lavora con le tecnologie Web Microsoft dal 1998. Scott lavora come consulente indipendente, formatore e scrittore. Il suo ultimo libro è Sams Teach Yourself ASP.NET 2.0 in 24 ore. Può essere raggiunto all'indirizzo mitchell@4GuysFromRolla.com. o tramite il suo blog, disponibile all'indirizzo http://ScottOnWriting.NET.
Commenti e suggerimenti
Presto disponibile: Nel corso del 2024 verranno gradualmente disattivati i problemi di GitHub come meccanismo di feedback per il contenuto e ciò verrà sostituito con un nuovo sistema di feedback. Per altre informazioni, vedere https://aka.ms/ContentUserFeedback.
Invia e visualizza il feedback per