En översikt över redigering och borttagning av data i datalistan (VB)

av Scott Mitchell

Ladda ned PDF

DataList saknar inbyggda funktioner för redigering och borttagning, men i den här självstudien får vi se hur du skapar en datalista som stöder redigering och borttagning av underliggande data.

Inledning

I självstudien En översikt över infogning, uppdatering och borttagning av data tittade vi på hur du infogar, uppdaterar och tar bort data med hjälp av programarkitekturen, en ObjectDataSource och kontrollerna GridView, DetailsView och FormView. Med ObjectDataSource och dessa tre datawebbkontroller var implementeringen av enkla gränssnitt för datamodifiering en snap och innebar att bara kryssa i en kryssruta från en smart tagg. Ingen kod behövde skrivas.

DataList saknar tyvärr de inbyggda funktionerna för redigering och borttagning som ingår i GridView-kontrollen. Den här saknade funktionen beror delvis på att DataList är en relik från den tidigare versionen av ASP.NET, när deklarativa datakällkontroller och kodfria datamodifieringssidor inte var tillgängliga. Även om DataList i ASP.NET 2.0 inte erbjuder samma funktioner för dataändringar som GridView, kan vi använda ASP.NET 1.x-tekniker för att inkludera sådana funktioner. Den här metoden kräver lite kod, men som vi ser i den här självstudien har DataList vissa händelser och egenskaper på plats för att underlätta processen.

I den här självstudien får vi se hur du skapar en datalista som stöder redigering och borttagning av underliggande data. Framtida självstudier kommer att undersöka mer avancerade redigerings- och borttagningsscenarier, inklusive validering av indatafält, och elegant hantering av undantag som genereras från dataåtkomst- eller affärslogiklagren och så vidare.

Steg 1: Skapa webbsidor för redigering och borttagning av handledningar

Innan vi börjar utforska hur du uppdaterar och tar bort data från en datalista ska vi först ta en stund att skapa de ASP.NET sidor i vårt webbplatsprojekt som vi behöver för den här självstudien och de kommande flera. Börja med att lägga till en ny mapp med namnet EditDeleteDataList. Lägg sedan till följande ASP.NET sidor i mappen och se till att associera varje sida med Site.master huvudsidan:

• Default.aspx
• Basics.aspx
• BatchUpdate.aspx
• ErrorHandling.aspx
• UIValidation.aspx
• CustomizedUI.aspx
• OptimisticConcurrency.aspx
• ConfirmationOnDelete.aspx
• UserLevelAccess.aspx

Bild 1: Lägg till ASP.NET-sidorna för handledningarna

Precis som i de andra mapparna listar Default.aspx i EditDeleteDataList-mappen självstudierna i sitt avsnitt. Kom ihåg att SectionLevelTutorialListing.ascx användarkontrollen innehåller den här funktionen. Lägg därför till den här användarkontrollen genom att Default.aspx dra den från Solution Explorer till sidans designvy.

Bild 2: Lägg till SectionLevelTutorialListing.ascx användarkontrollen Default.aspx i (Klicka om du vill visa en bild i full storlek)

Slutligen lägger du till sidorna som poster i Web.sitemap-filen. Mer specifikt lägger du till följande markering efter huvud-/detaljrapporterna med DataList och Repeater <siteMapNode>:

<siteMapNode
    title="Editing and Deleting with the DataList"
    description="Samples of Reports that Provide Editing and Deleting Capabilities"
    url="~/EditDeleteDataList/Default.aspx" >
    <siteMapNode
        title="Basics"
        description="Examines the basics of editing and deleting with the
                     DataList control."
        url="~/EditDeleteDataList/Basics.aspx" />
    <siteMapNode
        title="Batch Update"
        description="Examines how to update multiple records at once in a
                     fully-editable DataList."
        url="~/EditDeleteDataList/BatchUpdate.aspx" />
    <siteMapNode
        title="Error Handling"
        description="Learn how to gracefully handle exceptions raised during the
                     data modification workflow."
        url="~/EditDeleteDataList/ErrorHandling.aspx" />
    <siteMapNode
        title="Adding Data Entry Validation"
        description="Help prevent data entry errors by providing validation."
        url="~/EditDeleteDataList/UIValidation.aspx" />
    <siteMapNode
        title="Customize the User Interface"
        description="Customize the editing user interfaces."
        url="~/EditDeleteDataList/CustomizedUI.aspx" />
    <siteMapNode
        title="Optimistic Concurrency"
        description="Learn how to help prevent simultaneous users from
                     overwritting one another s changes."
        url="~/EditDeleteDataList/OptimisticConcurrency.aspx" />
    <siteMapNode
        title="Confirm On Delete"
        description="Prompt a user for confirmation when deleting a record."
        url="~/EditDeleteDataList/ConfirmationOnDelete.aspx" />
    <siteMapNode
        title="Limit Capabilities Based on User"
        description="Learn how to limit the data modification functionality
                     based on the user s role or permissions."
        url="~/EditDeleteDataList/UserLevelAccess.aspx" />
</siteMapNode>

Efter att du har uppdaterat Web.sitemap, ta en stund att besöka självstudiewebbplatsen via en webbläsare. Menyn till vänster innehåller nu objekt för självstudierna DataList-redigering och borttagning.

Bild 3: Webbplatskartan innehåller nu poster för handledningar om redigering och borttagning av datalistor

Steg 2: Undersöka tekniker för att uppdatera och ta bort data

Det är så enkelt att redigera och ta bort data med GridView eftersom GridView och ObjectDataSource fungerar tillsammans under täcket. Som beskrivs i handledningen Undersöka händelser som är associerade med infoga, uppdatera och ta bort, när en rads uppdateringsknapp klickas på, tilldelar GridView automatiskt sina fält som använde tvåvägs-databindning till UpdateParameters-samlingen av dess ObjectDataSource och anropar sedan ObjectDataSource: s Update()-metod.

DataList tillhandahåller tyvärr inte någon av de här inbyggda funktionerna. Det är vårt ansvar att se till att användarens värden tilldelas till ObjectDataSource-parametrarna och att dess Update() metod anropas. För att hjälpa oss i den här strävan tillhandahåller DataList följande egenskaper och händelser:

• Egenskapen DataKeyField när du uppdaterar eller tar bort måste vi kunna identifiera varje objekt unikt i datalistan. Ange den här egenskapen till primärnyckelfältet för de data som visas. Om du gör det fylls DataList-samlingen DataKeys med det angivna DataKeyField värdet för varje DataList-objekt.
• HändelsenEditCommand utlöses när en Knapp, LinkButton eller ImageButton vars CommandName egenskap är inställd på Redigera klickas.
• HändelsenCancelCommand utlöses när en Knapp, LinkButton eller ImageButton vars CommandName egenskap är inställd på Avbryt klickas.
• HändelsenUpdateCommand utlöses när en Knapp, LinkButton eller ImageButton vars CommandName egenskap är inställd på Uppdatera klickas.
• HändelsenDeleteCommand utlöses när en Knapp, LinkButton eller ImageButton vars CommandName egenskap är inställd på Ta bort klickas.

Med hjälp av dessa egenskaper och händelser finns det fyra metoder som vi kan använda för att uppdatera och ta bort data från DataList:

1. Med hjälp av ASP.NET 1.x-tekniker fanns DataList före ASP.NET 2.0 och ObjectDataSources och kunde uppdatera och ta bort data helt och hållet via programmatiska metoder. Den här tekniken dumpar ObjectDataSource helt och hållet och kräver att vi binder data till DataList direkt från affärslogiklagret, både när du hämtar data som ska visas och när du uppdaterar eller tar bort en post.
2. Om du använder en enskild ObjectDataSource-kontroll på sidan för att välja, uppdatera och ta bort medan datalistan saknar Funktionerna för inbyggd redigering och borttagning i GridView finns det ingen anledning att vi inte kan lägga till dem själva. Med den här metoden använder vi en ObjectDataSource precis som i GridView-exemplen, men måste skapa en händelsehanterare för DataList-händelsen UpdateCommand där vi anger ObjectDataSource-parametrarna och anropar dess Update() metod.
3. Med hjälp av en ObjectDataSource-kontroll för att välja, men uppdatera och ta bort direkt mot BLL när du använder alternativ 2, måste vi skriva en del kod i UpdateCommand händelsen och tilldela parametervärden och så vidare. I stället kan vi hålla oss till att använda ObjectDataSource för att välja, men göra uppdaterings- och borttagningsanropen direkt mot BLL(som med alternativ 1). Jag anser att uppdatering av data genom att interagera direkt med BLL leder till mer läsbar kod än att tilldela ObjectDataSource och UpdateParameters anropa dess Update() metod.
4. Om du använder deklarativa medel via flera ObjectDataSources kräver alla de tre föregående metoderna lite kod. Om du hellre vill fortsätta använda så mycket deklarativ syntax som möjligt är ett sista alternativ att inkludera flera ObjectDataSources på sidan. Den första ObjectDataSource hämtar data från BLL och binder dem till DataList. För uppdatering läggs en annan ObjectDataSource till, men läggs till direkt i DataList s EditItemTemplate. Om du vill inkludera stöd för borttagning behövs ytterligare en ObjectDataSource i ItemTemplate. Med den här metoden använder ControlParameters dessa inbäddade ObjectDataSource för att deklarativt binda ObjectDataSource-parametrarna till användarens indatakontroller (i stället för att behöva ange dem programmatiskt i DataLists UpdateCommand händelsehanterare). Den här metoden kräver fortfarande lite kod som vi behöver för att anropa inbäddade ObjectDataSource s Update() eller Delete() kommando, men kräver mycket mindre än med de andra tre metoderna. Nackdelen här är att flera ObjectDataSources gör sidan rörig, vilket förringar den övergripande läsbarheten.

Om tvingad att bara använda någon av dessa metoder, skulle jag välja alternativ 1 eftersom det ger mest flexibilitet och eftersom DataList ursprungligen utformades för att rymma detta mönster. DataList utökades till att fungera med ASP.NET 2.0-datakällkontroller, men den har inte alla utökningspunkter eller funktioner i de officiella ASP.NET 2.0-datawebbkontrollerna (GridView, DetailsView och FormView). Alternativ 2 till 4 är dock inte utan förtjänst.

Detta och framtida självstudier för redigering och borttagning kommer att använda en ObjectDataSource för att hämta data för visning och för att dirigera anrop till BLL för uppdatering och borttagning av data (alternativ 3).

Steg 3: Lägga till datalistan och konfigurera dess ObjectDataSource

I den här självstudien skapar vi en DataList som visar produktinformation och ger användaren möjlighet att redigera namn och pris och ta bort produkten helt och hållet. I synnerhet hämtar vi de poster som ska visas med hjälp av en ObjectDataSource, men utför uppdaterings- och borttagningsåtgärderna genom att interagera direkt med BLL:n. Innan vi oroar oss för att implementera redigerings- och borttagningsfunktionerna i DataList, låt oss först göra så att sidan visar produkterna i ett skrivskyddat gränssnitt. Eftersom vi har gått igenom de här stegen i tidigare självstudier går jag igenom dem snabbt.

Börja med att Basics.aspx öppna sidan i EditDeleteDataList mappen och lägg till en DataList på sidan från designvyn. Skapa sedan en ny ObjectDataSource från datalistans smarta tagg. Eftersom vi arbetar med produktdata, konfigurerar du det så att klassen ProductsBLL används. Om du vill hämta alla produkter väljer du GetProducts() metoden på fliken SELECT.

Konfigurera ObjectDataSource för att använda klassen ProductsBLL

Bild 4: Konfigurera ObjectDataSource att använda ProductsBLL klassen (Klicka om du vill visa en bild i full storlek)

Bild 5: Returnera produktinformationen GetProducts() med hjälp av metoden (Klicka om du vill visa en bild i full storlek)

DataList, liksom GridView, är inte utformad för att infoga nya data. Välj därför alternativet (Ingen) i listrutan på fliken INSERT. Välj också (Ingen) för flikarna UPDATE och DELETE eftersom uppdateringarna och borttagningarna utförs programmatiskt via BLL.

Bild 6: Bekräfta att Drop-Down-listorna i flikarna INSERT, UPDATE och DELETE i ObjectDataSource är inställda på (Ingen) (Klicka om du vill visa en bild i full storlek)

När du har konfigurerat ObjectDataSource klickar du på Slutför och återgår till designern. Som vi har sett i tidigare exempel skapar Visual Studio automatiskt en ItemTemplate för listrutan när du slutför ObjectDataSource-konfigurationen och visar vart och ett av datafälten. Ersätt detta ItemTemplate med ett som endast visar produktens namn och pris. Ange också egenskapen RepeatColumns till 2.

När du har ersatt standarddatalistan ItemTemplate med en anpassad bör den deklarativa markeringen på sidan se ut ungefär så här:

<asp:DataList ID="DataList1" runat="server" DataKeyField="ProductID"
    DataSourceID="ObjectDataSource1" RepeatColumns="2">
    <ItemTemplate>
        <h5>
            <asp:Label runat="server" ID="ProductNameLabel"
                Text='<%# Eval("ProductName") %>'></asp:Label>
        </h5>
        Price: <asp:Label runat="server" ID="Label1"
                    Text='<%# Eval("UnitPrice", "{0:C}") %>' />
        <br />
        <br />
    </ItemTemplate>
</asp:DataList>
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server"
    SelectMethod="GetProducts" TypeName="ProductsBLL"
    OldValuesParameterFormatString="original_{0}">
</asp:ObjectDataSource>

Ta en stund att se våra framsteg via en webbläsare. Som bild 7 visar Visar DataList produktnamnet och enhetspriset för varje produkt i två kolumner.

Bild 7: Produktnamn och priser visas i en Two-Column DataList (Klicka om du vill visa en bild i full storlek)

Om du inaktiverar visningstillståndet i GridView utelämnas bara trivial tillståndsinformation, men kontrolltillståndet bibehålls (vilket inkluderar det tillstånd som krävs för redigering och borttagning). DataList, som har skapats inom tidsramen ASP.NET 1.x, använder inte kontrolltillståndet och måste därför ha visningstillstånd aktiverat. Mer information om syftet med kontrolltillståndet och hur det skiljer sig från visningstillstånd finns i Kontrolltillstånd jämfört med Visningstillstånd .

Steg 4: Lägga till ett användargränssnitt för redigering

GridView-kontrollen består av en samling fält (BoundFields, CheckBoxFields, TemplateFields och så vidare). De här fälten kan justera sin renderade markering beroende på läget. När ett BoundField till exempel är i skrivskyddat läge visas dess datafältvärde som text; när den är i redigeringsläge återges en TextBox-webbkontroll vars Text egenskap har tilldelats datafältvärdet.

DataList återger å andra sidan sina objekt med hjälp av mallar. Skrivskyddade objekt återges med hjälp av ItemTemplate medan objekt i redigeringsläge återges via EditItemTemplate. I det här läget har vår DataList bara en ItemTemplate. För att stödja redigeringsfunktioner på objektnivå måste vi lägga till en EditItemTemplate som innehåller den markering som ska visas för det redigerbara objektet. I den här självstudien använder vi TextBox-webbkontroller för att redigera produktens namn och enhetspris.

EditItemTemplate Kan skapas antingen deklarativt eller via designern (genom att välja alternativet Redigera mallar från datalistans smarta tagg). Om du vill använda alternativet Redigera mallar klickar du först på länken Redigera mallar i den smarta taggen och väljer EditItemTemplate sedan objektet i listrutan.

Bild 8: Välj att arbeta med datalistefilerna EditItemTemplate (Klicka om du vill visa en bild i full storlek)

Skriv sedan Produktnamn: och Pris: och dra sedan två TextBox-kontroller från verktygslådan till EditItemTemplate gränssnittet i designern. Ange textrutornas ID egenskaper till ProductName och UnitPrice.

Bild 9: Lägg till en textruta för produktens namn och pris (Klicka om du vill visa en bild i full storlek)

Vi måste binda motsvarande värden för produktdatafält till Text egenskaperna för de två textrutorna. Från de smarta textrutorna klickar du på länken Redigera databindningar och associerar sedan lämpligt datafält med Text egenskapen, enligt bild 10.

Bild 10: Binda datafälten ProductName och UnitPrice till Text textrutornas egenskaper

Observera att dialogrutan Redigera databindningar i bild 10 inte innehåller kryssrutan Dubbelriktad databindning som finns när du redigerar ett TemplateField i GridView eller DetailsView, eller en mall i FormView. Med funktionen för dubbelriktad databindning kunde värdet som angavs i indatawebbkontrollen automatiskt tilldelas motsvarande ObjectDataSource-objekt InsertParameters eller UpdateParameters vid infogning eller uppdatering av data. DataList stöder inte dubbelriktad databindning som vi kommer att se senare i den här självstudien, när användaren har gjort sina ändringar och är redo att uppdatera data, måste vi programmatiskt komma åt dessa TextBoxes-egenskaper Text och skicka in deras värden till lämplig UpdateProduct metod i ProductsBLL klassen.

Slutligen måste vi lägga till knapparna Uppdatera och Avbryt i EditItemTemplate. Som vi såg i självstudiekursen Master/Detail Using a Bulleted List of Master Records with a Details DataList, när en Knapp, LinkButton eller ImageButton vars CommandName egenskap har angetts klickas inifrån en Repeater eller DataList, genereras ItemCommand-händelsen i Repeater eller DataList. Om egenskapen är inställd på ett visst värde för DataList CommandName kan även en ytterligare händelse utlöses. De särskilda CommandName egenskapsvärdena omfattar bland annat:

• Avbryt genererar CancelCommand händelsen
• Redigering utlöser EditCommand-händelsen
• Uppdateringen utlöser UpdateCommand händelsen

Tänk på att dessa händelser hanteras utöver händelsen ItemCommand.

Lägg till två knappwebbkontroller i EditItemTemplate, en där CommandName är inställd på Uppdatera och den andra inställd på Avbryt. När du har lagt till dessa två knappwebbkontroller bör designern se ut ungefär så här:

Bild 11: Lägg till uppdatera och avbryt knappar i EditItemTemplate (Klicka om du vill visa en bild i full storlek)

När du EditItemTemplate har slutfört datalistans deklarativa markering bör den se ut ungefär så här:

<asp:DataList ID="DataList1" runat="server" DataKeyField="ProductID"
    DataSourceID="ObjectDataSource1" RepeatColumns="2">
    <ItemTemplate>
        <h5>
            <asp:Label runat="server" ID="ProductNameLabel"
                Text='<%# Eval("ProductName") %>' />
        </h5>
        Price: <asp:Label runat="server" ID="Label1"
                    Text='<%# Eval("UnitPrice", "{0:C}") %>' />
        <br />
        <br />
    </ItemTemplate>
    <EditItemTemplate>
        Product name:
            <asp:TextBox ID="ProductName" runat="server"
                Text='<%# Eval("ProductName") %>' /><br />
        Price:
            <asp:TextBox ID="UnitPrice" runat="server"
                Text='<%# Eval("UnitPrice", "{0:C}") %>' /><br />
        <br />
        <asp:Button ID="UpdateProduct" runat="server"
            CommandName="Update" Text="Update" /> 
        <asp:Button ID="CancelUpdate" runat="server"
            CommandName="Cancel" Text="Cancel" />
    </EditItemTemplate>
</asp:DataList>

Steg 5: Lägga till VVS för att ange redigeringsläge

I det här läget har vår DataList ett redigeringsgränssnitt som definierats via dess EditItemTemplate, men det finns för närvarande inget sätt för en användare som besöker vår sida att ange att han vill redigera en produktinformation. Vi måste lägga till en redigeringsknapp för varje produkt som, när den klickas, återger det datalistobjektet i redigeringsläge. Börja med att lägga till knappen Redigera i ItemTemplate, antingen via designern eller deklarativt. Se till att ange knappens egenskap till CommandName Redigera.

När du har lagt till knappen Redigera kan du ta en stund att titta på sidan via en webbläsare. Med det här tillägget bör varje produktlista innehålla en redigera-knapp.

Bild 12: Lägg till uppdatera och avbryt knappar i EditItemTemplate (Klicka om du vill visa en bild i full storlek)

Om du klickar på knappen får du ett återanrop, men produktlistan försätts inte i redigeringsläge. För att göra produkten redigerbar måste vi:

1. Ställ in DataLists EditItemIndex egenskap till indexet för den DataListItem vars redigeringsknapp just klickades.
2. Ombind data till DataList. När DataList återges på nytt kommer den DataListItem som ItemIndex motsvarar DataLists EditItemIndex att återges med hjälp av dess EditItemTemplate.

Eftersom DataList-händelsen EditCommand utlöses när knappen Redigera klickas skapar du en EditCommand händelsehanterare med följande kod:

Protected Sub DataList1_EditCommand(source As Object, e As DataListCommandEventArgs) _
    Handles DataList1.EditCommand
    ' Set the DataList's EditItemIndex property to the
    ' index of the DataListItem that was clicked
    DataList1.EditItemIndex = e.Item.ItemIndex
    ' Rebind the data to the DataList
    DataList1.DataBind()
End Sub

Händelsehanteraren EditCommand passeras som ett objekt av typen DataListCommandEventArgs som sin andra inmatningsparameter, vilket inkluderar en referens till det DataListItem vars redigeringsknapp klickades (e.Item). Händelsehanteraren anger först DataList s EditItemIndex till ItemIndex den redigerbara DataListItem och binder sedan om data till DataList genom att anropa metoden DataList s DataBind() .

När du har lagt till den här händelsehanteraren går du tillbaka till sidan i en webbläsare. Om du klickar på knappen Redigera nu blir den klickade produkten redigerbar (se bild 13).

Bild 13: Om du klickar på knappen Redigera kan produkten redigeras (klicka om du vill visa en bild i full storlek)

Steg 6: Spara användarens ändringar

Att klicka på de redigerade produktknapparna Uppdatera eller Avbryt gör ingenting just nu. för att lägga till den här funktionen måste vi skapa händelsehanterare för DataList s UpdateCommand och CancelCommand händelser. Börja med att skapa CancelCommand händelsehanteraren, som körs när den redigerade produktens avbryt-knapp klickas och den har till uppgift att returnera DataList till dess förredigeringstillstånd.

För att datalistan ska återge alla objekt i läsläge måste vi:

1. Ange DataLists EditItemIndex egenskap till indexet för ett obefintligt DataListItem index. -1 är ett säkert val eftersom indexen DataListItem börjar på 0.
2. Ombind data till DataList. Eftersom inga DataListItemItemIndex es motsvarar DataList, visas hela EditItemIndex DataList i skrivskyddat läge.

Dessa steg kan utföras med följande händelsehanterarkod:

Protected Sub DataList1_CancelCommand(source As Object, e As DataListCommandEventArgs) _
    Handles DataList1.CancelCommand
    ' Set the DataList's EditItemIndex property to -1
    DataList1.EditItemIndex = -1
    ' Rebind the data to the DataList
    DataList1.DataBind()
End Sub

Med det här tillägget returnerar knappen Avbryt datalistan till dess förredigeringstillstånd.

Den sista händelsehanteraren som vi behöver slutföra är UpdateCommand. Den här händelsehanteraren måste:

1. Programmatisk åtkomst till produktnamnet och priset angivna av användaren samt den redigerade produkten ProductID.
2. Initiera uppdateringsprocessen genom att anropa lämplig UpdateProduct överlagring i ProductsBLL klassen.
3. Ange DataLists EditItemIndex egenskap till indexet för ett obefintligt DataListItem index. -1 är ett säkert val eftersom indexen DataListItem börjar på 0.
4. Ombind data till DataList. Eftersom inga DataListItemItemIndex es motsvarar DataList, visas hela EditItemIndex DataList i skrivskyddat läge.

Steg 1 och 2 ansvarar för att spara användarens ändringar. Steg 3 och 4 returnerar DataList till dess förredigeringstillstånd när ändringarna har sparats och är identiska med de steg som utförs i CancelCommand händelsehanteraren.

För att få det uppdaterade produktnamnet och priset måste vi använda FindControl metoden för att programmatiskt referera till TextBox Web-kontrollerna i EditItemTemplate. Vi måste också hämta värdet för den redigerade produkten ProductID . När vi först band ObjectDataSource till DataList, tilldelade Visual Studio DataList:s egenskapsvärde DataKeyField till det primära nyckelvärdet från datakällan (ProductID). Det här värdet kan sedan hämtas från datalistans DataKeys samling. Ta en stund att se till att egenskapen DataKeyField verkligen är inställd på ProductID.

Följande kod implementerar de fyra stegen:

Protected Sub DataList1_UpdateCommand(source As Object, e As DataListCommandEventArgs) _
    Handles DataList1.UpdateCommand
    ' Read in the ProductID from the DataKeys collection
    Dim productID As Integer = Convert.ToInt32(DataList1.DataKeys(e.Item.ItemIndex))
    ' Read in the product name and price values
    Dim productName As TextBox = CType(e.Item.FindControl("ProductName"), TextBox)
    Dim unitPrice As TextBox = CType(e.Item.FindControl("UnitPrice"), TextBox)
    Dim productNameValue As String = Nothing
    If productName.Text.Trim().Length > 0 Then
        productNameValue = productName.Text.Trim()
    End If
    Dim unitPriceValue As Nullable(Of Decimal) = Nothing
    If unitPrice.Text.Trim().Length > 0 Then
        unitPriceValue = Decimal.Parse(unitPrice.Text.Trim(), NumberStyles.Currency)
    End If
    ' Call the ProductsBLL's UpdateProduct method...
    Dim productsAPI As New ProductsBLL()
    productsAPI.UpdateProduct(productNameValue, unitPriceValue, productID)
    ' Revert the DataList back to its pre-editing state
    DataList1.EditItemIndex = -1
    DataList1.DataBind()
End Sub

Händelsehanteraren börjar med att läsa in den redigerade produkten ProductID från DataKeys-samlingen. Därefter refereras de två textrutorna i EditItemTemplate, och deras Text-egenskaper lagras i de lokala variablerna productNameValue och unitPriceValue. Vi använder Decimal.Parse() metoden för att läsa värdet från UnitPrice textrutan så att om det angivna värdet har en valutasymbol kan det fortfarande konverteras korrekt till ett Decimal värde.

När du har läst värdena ProductsBLL anropas metoden class s UpdateProduct och skickar in produktens namn, pris och ProductID. Händelsehanteraren slutförs genom att datalistan återgår till dess förredigeringstillstånd med exakt samma logik som i CancelCommand händelsehanteraren.

EditCommandNär händelsehanterarna , CancelCommandoch UpdateCommand har slutförts kan en besökare redigera namnet och priset på en produkt. Figurerna 14–16 visar det här redigeringsarbetsflödet i praktiken.

Bild 14: När du först besöker sidan är alla produkter i Read-Only läge (Klicka om du vill visa en bild i full storlek)

Bild 15: Om du vill uppdatera ett produktnamn eller pris klickar du på knappen Redigera (klicka om du vill visa en bild i full storlek)

Bild 16: När du har ändrat värdet klickar du på Uppdatera för att återgå till Read-Only läge (Klicka om du vill visa en bild i full storlek)

Steg 7: Lägga till borttagningsfunktioner

Stegen för att lägga till borttagningsfunktioner i en datalista liknar dem för att lägga till redigeringsfunktioner. Kort sagt, måste vi lägga till en Ta bort-knapp till ItemTemplate som, när den klickas på:

1. Läser in motsvarande produkt ProductID via samlingen DataKeys.
2. Utför borttagningen genom att anropa ProductsBLL metoden class s DeleteProduct .
3. Återbinder data till DataListen.

Låt oss börja med att lägga till knappen Ta bort i ItemTemplate.

När du klickar på en knapp vars CommandName är Redigera, Uppdatera eller Avbryt genereras ItemCommand datalistehändelsen tillsammans med en ytterligare händelse (till exempel när du använder Redigera EditCommand händelsen utlöses också). På samma sätt utlöses CommandName-händelsen (tillsammans med DeleteCommand) om Button, LinkButton eller ImageButton finns i DataList vars ItemCommand-egenskap är inställd på Delete.

Lägg till knappen Ta bort bredvid knappen Redigera i ItemTemplate, och ange dess CommandName egenskap till Ta bort. När du har lagt till den här knappen bör datalistans ItemTemplate deklarativa syntax se ut så här:

<ItemTemplate>
    <h5>
        <asp:Label runat="server" ID="ProductNameLabel"
            Text='<%# Eval("ProductName") %>' />
    </h5>
    Price: <asp:Label runat="server" ID="Label1"
            Text='<%# Eval("UnitPrice", "{0:C}") %>' />
    <br />
    <asp:Button runat="server" id="EditProduct" CommandName="Edit"
        Text="Edit" />
     
    <asp:Button runat="server" id="DeleteProduct" CommandName="Delete"
        Text="Delete" />
    <br />
    <br />
</ItemTemplate>

Skapa sedan en händelsehanterare för DataList-händelsen DeleteCommand med hjälp av följande kod:

Protected Sub DataList1_DeleteCommand(source As Object, e As DataListCommandEventArgs) _
    Handles DataList1.DeleteCommand
    ' Read in the ProductID from the DataKeys collection
    Dim productID As Integer = Convert.ToInt32(DataList1.DataKeys(e.Item.ItemIndex))
    ' Delete the data
    Dim productsAPI As New ProductsBLL()
    productsAPI.DeleteProduct(productID)
    ' Rebind the data to the DataList
    DataList1.DataBind()
End Sub

Om du klickar på knappen Ta bort genereras ett postback och DataList-händelsen triggas DeleteCommand. I händelsehanteraren används det klickade produktvärdet ProductID från DataKeys samlingen. Därefter tas produkten bort genom att anropa ProductsBLL metoden class s DeleteProduct .

När du har tagit bort produkten är det viktigt att vi ombinder data till DataList (DataList1.DataBind()), annars fortsätter DataList att visa produkten som just har tagits bort.

Sammanfattning

Även om DataList saknar det punkt-och-klick-stöd som GridView har för redigering och borttagning, kan man med lite kod lägga till dessa funktioner till den. I den här självstudien såg vi hur du skapar en lista med två kolumner över produkter som kan tas bort och vars namn och pris kan redigeras. Att lägga till stöd för redigering och borttagning handlar om att inkludera lämpliga webbkontroller i ItemTemplate och EditItemTemplate, skapa motsvarande händelsehanterare, läsa de användarangivna och primära nyckelvärdena och interagera med affärslogiklagret.

Även om vi har lagt till grundläggande redigerings- och borttagningsfunktioner i DataList saknar den mer avancerade funktioner. Det finns till exempel ingen validering av indatafält – om en användare anger ett pris på För dyrt genereras ett undantag av Decimal.Parse när du försöker konvertera För dyrt till en Decimal. På samma sätt visas standardfelskärmen om det finns ett problem med att uppdatera data i affärslogiken eller dataåtkomstskikten. Utan någon form av bekräftelse på knappen Ta bort är det alltför troligt att en produkt tas bort av misstag.

I framtida självstudier kommer vi att se hur vi kan förbättra redigeringsupplevelsen.

Lycka till med programmerandet!

Om författaren

Scott Mitchell, författare till sju ASP/ASP.NET-böcker och grundare av 4GuysFromRolla.com, har arbetat med Microsofts webbtekniker sedan 1998. Scott arbetar som oberoende konsult, tränare och författare. Hans senaste bok är Sams Teach Yourself ASP.NET 2.0 på 24 timmar. Han kan nås på mitchell@4GuysFromRolla.com.

Särskilt tack till

Den här självstudieserien granskades av många användbara granskare. Huvudgranskare för den här självstudien var Zack Jones, Ken Pespisa och Randy Schmidt. Vill du granska mina kommande MSDN-artiklar? Om så är fallet, hör av dig på mitchell@4GuysFromRolla.com.