DataList'te Verileri Düzenleme ve Silmeye Genel Bakış (VB)

tarafından Scott Mitchell

PDF’yi İndir

DataList'te yerleşik düzenleme ve silme özellikleri olmasa da, bu öğreticide temel alınan verilerin düzenlenmesini ve silinmesini destekleyen bir DataList'in nasıl oluşturulacağını göreceğiz.

Giriş

Veri Ekleme, Güncelleştirme ve Silmeye Genel Bakış öğreticisinde uygulama mimarisi, ObjectDataSource ve GridView, DetailsView ve FormView denetimlerini kullanarak veri ekleme, güncelleştirme ve silme işlemlerine göz attık. ObjectDataSource ve bu üç veri Web denetimiyle basit veri değişikliği arabirimleri uygulamak çok kolaydı ve yalnızca akıllı etiketten onay kutusunun işaretlenmesine neden oldu. Kod yazılması gerekmez.

Ne yazık ki DataList, GridView denetiminde bulunan yerleşik düzenleme ve silme özelliklerinden yoksun. Bu eksik işlevsellik kısmen, bildirim temelli veri kaynağı denetimleri ve kod içermeyen veri değiştirme sayfaları kullanılamadığında DataList'in önceki ASP.NET sürümünden bir kalıntı olmasından kaynaklanır. ASP.NET 2.0'daki DataList, GridView ile aynı veri değişikliği özelliklerini sunmasa da, bu işlevleri dahil etmek için ASP.NET 1.x tekniklerini kullanabiliriz. Bu yaklaşım biraz kod gerektirir, ancak bu öğreticide göreceğimiz gibi DataList'te bu işleme yardımcı olacak bazı olaylar ve özellikler bulunur.

Bu öğreticide, temel alınan verilerin düzenlenmesini ve silinmesini destekleyen bir DataList oluşturmayı öğreneceksiniz. Gelecekteki öğreticilerde giriş alanı doğrulaması, Veri Erişimi veya İş Mantığı Katmanlarından oluşturulan özel durumları düzgün bir şekilde işleme gibi daha gelişmiş düzenleme ve silme senaryoları incelenecektir.

Not

DataList'de olduğu gibi Repeater denetimi de ekleme, güncelleştirme veya silme için kullanıma hazır işlevselliğine sahip değil. Bu tür işlevler eklense de DataList, Repeater'da bulunmayan özellikleri ve olayları içerir ve bu özelliklerin eklenmesini basitleştirir. Bu nedenle, bu öğretici ve düzenleme ve silmeyi ele alan gelecekteki öğreticiler kesinlikle DataList'e odaklanacaktır.

1. Adım: Öğreticileri Düzenleme ve Silme Web Sayfalarını Oluşturma

Bir DataList'ten verilerin nasıl güncelleştirildiğini ve silindiğini keşfetmeye başlamadan önce, bu öğretici ve sonraki birkaç öğretici için ihtiyacımız olacak web sitesi projemizde ASP.NET sayfalarını oluşturmak için biraz zaman ayıralım. adlı EditDeleteDataListyeni bir klasör ekleyerek başlayın. Ardından, aşağıdaki ASP.NET sayfaları bu klasöre ekleyerek her sayfayı ana sayfayla ilişkilendirdiğinizden Site.master emin olun:

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

Öğreticiler için ASP.NET Sayfaları Ekleme

Şekil 1: Öğreticiler için ASP.NET Sayfaları Ekleme

Diğer klasörlerde olduğu gibi klasöründe Default.aspx de EditDeleteDataList kendi bölümündeki öğreticiler listelenir. Kullanıcı Denetimi'nin SectionLevelTutorialListing.ascx bu işlevi sağladığını hatırlayın. Bu nedenle, bu Kullanıcı Denetimini Default.aspx Çözüm Gezgini sayfanın Tasarım görünümüne sürükleyerek öğesine ekleyin.

SectionLevelTutorialListing.ascx Kullanıcı Denetimini Default.aspx ekleme

Şekil 2: Kullanıcı Denetimini ekleme SectionLevelTutorialListing.ascxDefault.aspx (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Son olarak, sayfaları dosyaya Web.sitemap girdi olarak ekleyin. Özellikle, DataList ve Repeater <siteMapNode>ile Ana/Ayrıntı Raporları'nın ardından aşağıdaki işaretlemeyi ekleyin:

<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>

güncelleştirdikten Web.sitemapsonra, öğreticiler web sitesini bir tarayıcı üzerinden görüntülemek için biraz zaman ayırın. Sol taraftaki menüde artık DataList düzenleme ve silme öğreticileri için öğeler bulunur.

Site Haritası Artık DataList Düzenleme ve Silme Öğreticileri için Girdiler Içeriyor

Şekil 3: Site Haritası Artık DataList Düzenleme ve Silme Öğreticileri için Girdiler Içeriyor

2. Adım: Verileri Güncelleştirme ve Silme tekniklerini inceleme

GridView ile verileri düzenlemek ve silmek çok kolaydır çünkü kapakların altında GridView ve ObjectDataSource birlikte çalışır. Satır güncelleştirme düğmesine tıklandığında, Ekleme, Güncelleştirme ve Silme ile İlişkili Olayları inceleme öğreticisinde açıklandığı gibi GridView, ObjectDataSource koleksiyonuna iki yönlü veri bağlama UpdateParameters kullanan alanlarını otomatik olarak atar ve bu ObjectDataSource Update() yöntemini çağırır.

Ne yazık ki DataList bu yerleşik işlevlerin hiçbirini sağlamaz. Kullanıcının değerlerinin ObjectDataSource parametrelerine atandığından ve Update() yönteminin çağrıldığından emin olmak bizim sorumluluğumuzdadır. Bu çabada bize yardımcı olmak için DataList aşağıdaki özellikleri ve olayları sağlar:

  • DataKeyField Özelliği güncelleştirirken veya silerken DataList'teki her öğeyi benzersiz olarak tanımlayabilmemiz gerekir. Bu özelliği, görüntülenen verilerin birincil anahtar alanına ayarlayın. Bunu yaptığınızda DataList koleksiyonu her DataList DataKeys öğesi için belirtilen DataKeyField değerle doldurulur.
  • EditCommand Özelliği Düzenle olarak ayarlanmış bir Button, LinkButton veya ImageButton CommandName tıklandığında olay tetikler.
  • ÖzelliğiCancelCommand İptal olarak ayarlanmış bir Button, LinkButton veya ImageButton CommandName öğesine tıklandığında olay tetikleniyor.
  • UpdateCommand Özelliği Güncelleştir olarak ayarlanmış bir Button, LinkButton veya ImageButton CommandName tıklandığında olay tetikler.
  • DeleteCommand Özelliği Delete olarak ayarlanmış bir Button, LinkButton veya ImageButton CommandName öğesine tıklandığında olay tetikleniyor.

Bu özellikleri ve olayları kullanarak DataList'ten verileri güncelleştirmek ve silmek için kullanabileceğimiz dört yaklaşım vardır:

  1. ASP.NET 1.x Teknikleri kullanılarak DataList, ASP.NET 2.0 ve ObjectDataSources'un öncesinde mevcuttu ve program aracılığıyla verileri tamamen güncelleştirip silebiliyordu. Bu teknik ObjectDataSource'tan tamamen kurtulup verileri doğrudan İş Mantığı Katmanı'ndan DataList'e bağlamamızı gerektirir. Hem görüntülenecek verileri alma hem de kaydı güncelleştirirken veya silerken.
  2. DataList'te GridView'un doğal düzenleme ve silme özellikleri eksikken, Sayfada Seçme, Güncelleştirme ve Silme için Tek Bir ObjectDataSource Denetimi kullanmak, bunları kendimize ekleyemememiz için bir neden yoktur. Bu yaklaşımla, GridView örneklerinde olduğu gibi bir ObjectDataSource kullanırız, ancak ObjectDataSource parametrelerini ayarlayıp yöntemini çağırdığımız Update() DataList UpdateCommand olayı için bir olay işleyicisi oluşturmamız gerekir.
  3. 2. seçeneği kullanırken Seçme, ancak Güncelleştirme ve Silme için Bir ObjectDataSource Denetimi kullanarak olayda UpdateCommand parametre değerleri atayarak ve benzeri bir kod yazmamız gerekir. Bunun yerine, seçim için ObjectDataSource'u kullanmaya devam edebilir, ancak güncelleştirme ve silme çağrılarını doğrudan BLL'ye (1. seçenek gibi) karşı yapabiliriz. Bence verileri doğrudan BLL ile birlikte kullanarak güncelleştirmek, ObjectDataSource'ları UpdateParameters atamaktan ve yöntemini çağırmaktan daha okunabilir bir koda Update() yol açar.
  4. Birden Çok ObjectDataSources aracılığıyla Bildirim Temelli Ortalamalar'ın kullanılması, önceki üç yaklaşımın tümü için biraz kod gerekir. Mümkün olduğunca bildirim temelli söz dizimini kullanmaya devam etmek isterseniz, son seçenek sayfaya birden çok ObjectDataSource eklemektir. İlk ObjectDataSource, BLL'den verileri alır ve DataList'e bağlar. Güncelleştirme için başka bir ObjectDataSource eklenir, ancak doğrudan DataList'in EditItemTemplateiçine eklenir. Silme desteğini dahil etmek için, içinde başka bir ObjectDataSource gerekir ItemTemplate. Bu yaklaşımla, bu katıştırılmış ObjectDataSource, ObjectDataSource parametrelerini kullanıcı giriş denetimlerine bildirimli olarak bağlamak için kullanır ControlParameters (Bunları DataList olay UpdateCommand işleyicisinde programlı olarak belirtmek zorunda kalmadan). Bu yaklaşım hala katıştırılmış ObjectDataSource s Update() veya Delete() komutunu çağırmamız gereken bir miktar kod gerektirir, ancak diğer üç yaklaşımdan çok daha azını gerektirir. Burada dezavantajı, birden çok ObjectDataSource'un sayfayı karmaşık hale getirmek ve genel okunabilirliği azaltmaktır.

Bu yaklaşımlardan yalnızca birini kullanmaya zorlanırsa, en fazla esnekliği sağladığından ve DataList başlangıçta bu desene uyacak şekilde tasarlandığından 1 seçeneğini belirlerdim. DataList, ASP.NET 2.0 veri kaynağı denetimleriyle çalışacak şekilde genişletilmiş olsa da, resmi ASP.NET 2.0 veri Web denetimlerinin (GridView, DetailsView ve FormView) tüm genişletilebilirlik noktalarına veya özelliklerine sahip değildir. Ancak 2 ile 4 arasında seçenekler liyakatsiz değildir.

Bu ve gelecekteki düzenleme ve silme öğreticileri, verileri görüntülemek ve verileri güncelleştirmek ve silmek için BLL'ye yapılan çağrıları görüntülemek ve yönlendirmek için bir ObjectDataSource kullanacaktır (seçenek 3).

3. Adım: DataList'i Ekleme ve ObjectDataSource'unu Yapılandırma

Bu öğreticide, ürün bilgilerini listeleyen ve her ürün için kullanıcıya adı ve fiyatı düzenleme ve ürünü tamamen silme olanağı sağlayan bir DataList oluşturacağız. Özellikle, bir ObjectDataSource kullanarak görüntülenecek kayıtları alacaktır, ancak doğrudan BLL ile birlikte çalışarak güncelleştirme ve silme eylemlerini gerçekleştireceğiz. DataList'te düzenleme ve silme özelliklerini uygulama konusunda endişelenmeden önce, önce sayfayı kullanarak ürünleri salt okunur bir arabirimde görüntüleyelim. Önceki öğreticilerde bu adımları incelediğimiz için hızlı bir şekilde ilerleyeceğim.

İlk olarak klasördeki EditDeleteDataList sayfayı Basics.aspx açın ve Tasarım görünümünden sayfaya bir DataList ekleyin. Ardından DataList'in akıllı etiketinden yeni bir ObjectDataSource oluşturun. Ürün verileriyle çalıştığımızdan, sınıfını kullanacak ProductsBLL şekilde yapılandırın. Tüm ürünleri almak için SELECT sekmesinde yöntemini seçinGetProducts().

ObjectDataSource'ı ProductsBLL Sınıfını Kullanacak Şekilde Yapılandırma

Şekil 4: ObjectDataSource'ı Sınıfı Kullanacak ProductsBLL Şekilde Yapılandırma (Tam boyutlu görüntüyü görüntülemek için tıklayın)

GetProducts() Yöntemini Kullanarak Ürün Bilgilerini Döndürme

Şekil 5: Yöntemi Kullanarak GetProducts() Ürün Bilgilerini Döndürme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

GridView gibi DataList, yeni veri eklemek için tasarlanmamıştır; bu nedenle, EKLE sekmesindeki açılan listeden (Hiçbiri) seçeneğini belirleyin. Güncelleştirmeler ve silmeler BLL aracılığıyla program aracılığıyla gerçekleştirileceğinden, GÜNCELLEŞTİr ve Sİl sekmeleri için de (Hiçbiri) öğesini seçin.

ObjectDataSource'un INSERT, UPDATE ve DELETE Sekmelerindeki Drop-Down Listeler (Yok) olarak ayarlandığını onaylayın

Şekil 6: ObjectDataSource INSERT, UPDATE ve DELETE Sekmelerindeki Drop-Down Listeler (Yok) olarak ayarlandığını onaylayın (Tam boyutlu görüntüyü görüntülemek için tıklayın)

ObjectDataSource'u yapılandırdıktan sonra Son'a tıklayın ve Tasarım Aracı geri gidin. Önceki örneklerde gördüğümüz gibi, ObjectDataSource yapılandırmasını tamamlarken Visual Studio, veri alanlarının her birini görüntüleyen DropDownList için otomatik olarak bir ItemTemplate oluşturur. Bunu ItemTemplate yalnızca ürünün adını ve fiyatını görüntüleyen bir adla değiştirin. Ayrıca özelliğini 2 olarak ayarlayın RepeatColumns .

Not

Verileri Ekleme, Güncelleştirme ve Silmeye Genel Bakış öğreticisinde açıklandığı gibi, ObjectDataSource kullanarak verileri değiştirirken mimarimiz objectDataSource bildirim temelli işaretlemesinden özelliğini kaldırmamızı OldValuesParameterFormatString (veya varsayılan değerine {0}sıfırlamamızı) gerektirir. Ancak bu öğreticide ObjectDataSource'ı yalnızca veri almak için kullanıyoruz. Bu nedenle, ObjectDataSource OldValuesParameterFormatString özellik değerini değiştirmemiz gerekmez (bunu yapmak zarar vermese de).

Varsayılan DataList ItemTemplate öğesini özelleştirilmiş bir veri listesiyle değiştirdikten sonra, sayfanızdaki bildirim temelli işaretleme aşağıdakine benzer görünmelidir:

<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>

İlerleme durumumuzu bir tarayıcı üzerinden görüntülemek için biraz zaman ayırın. Şekil 7'de gösterildiği gibi, DataList her ürünün ürün adını ve birim fiyatını iki sütunda görüntüler.

Ürün Adları ve Fiyatları bir Two-Column DataList'te görüntülenir

Şekil 7: Ürün Adları ve Fiyatları bir Two-Column DataList'te Görüntülenir (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Not

DataList,güncelleştirme ve silme işlemi için gereken bir dizi özelliğe sahiptir ve bu değerler görünüm durumunda depolanır. Bu nedenle, verileri düzenlemeyi veya silmeyi destekleyen bir DataList oluştururken DataList görünüm durumunun etkinleştirilmesi önemlidir.

Astute okuyucusu düzenlenebilir GridViews, DetailsViews ve FormViews oluştururken görünüm durumunu devre dışı bırakabildiğimizi hatırlayabilir. Bunun nedeni ASP.NET 2.0 Web denetimlerinin denetim durumunu içerebilmesidir. Bu durum, görünüm durumu gibi geri göndermelerde kalıcı hale getirilir ancak gerekli kabul edilir.

GridView'da görünüm durumunu devre dışı bırakmak yalnızca önemsiz durum bilgilerini atlar, ancak denetim durumunu korur (düzenleme ve silme için gereken durumu içerir). ASP.NET 1.x zaman çerçevesi içinde oluşturulan DataList, denetim durumunu kullanmaz ve bu nedenle görüntüleme durumunun etkinleştirilmiş olması gerekir. Denetim durumunun amacı ve görünüm durumundan farkı hakkında daha fazla bilgi için bkz. Denetim Durumu ve Görünüm Durumu.

4. Adım: Düzenleme Kullanıcı Arabirimi Ekleme

GridView denetimi bir alan koleksiyonundan oluşur (BoundFields, CheckBoxFields, TemplateFields vb.). Bu alanlar, modlarına bağlı olarak işlenmiş işaretlemelerini ayarlayabilir. Örneğin, salt okunur moddayken BoundField veri alanı değerini metin olarak görüntüler; düzenleme modundayken, özelliğine veri alanı değeri atanmış bir TextBox Web denetimi Text oluşturur.

Öte yandan DataList, şablon kullanarak öğelerini işler. Salt okunur öğeler kullanılarak ItemTemplate işlenirken, düzenleme modundaki öğeler aracılığıyla EditItemTemplateişlenir. Bu noktada DataList'imizde yalnızca bir ItemTemplatevardır. Öğe düzeyinde düzenleme işlevselliğini desteklemek için, düzenlenebilir öğe için görüntülenecek işaretlemeyi içeren bir EditItemTemplate eklememiz gerekir. Bu öğreticide, ürün adını ve birim fiyatını düzenlemek için TextBox Web denetimlerini kullanacağız.

EditItemTemplate bildirim temelli olarak veya Tasarım Aracı aracılığıyla oluşturulabilir (DataList'in akıllı etiketinden Şablonları Düzenle seçeneği seçilerek). Şablonları Düzenle seçeneğini kullanmak için, önce akıllı etiketteki Şablonları Düzenle bağlantısına tıklayın ve ardından açılan listeden öğeyi seçin EditItemTemplate .

DataList EditItemTemplate ile Çalışmayı Tercih Etme

Şekil 8: DataList EditItemTemplate ile Çalışmayı Tercih Etme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Ardından Ürün adı: ve Fiyat: yazın ve araç kutusundan iki TextBox denetimini Tasarım Aracı arabirimine EditItemTemplate sürükleyin. TextBoxes ID özelliklerini ve UnitPriceolarak ProductName ayarlayın.

Ürün Adı ve Fiyatı için TextBox Ekleme

Şekil 9: Ürün Adı ve Fiyatı için TextBox Ekleme (Tam boyutlu resmi görüntülemek için tıklayın)

İlgili ürün veri alanı değerlerini iki TextBox'ın özelliklerine Text bağlamamız gerekir. TextBoxes akıllı etiketlerinde, Veri Bağlamalarını Düzenle bağlantısına tıklayın ve şekil 10'da gösterildiği gibi uygun veri alanını özelliğiyle Text ilişkilendirin.

Not

Veri alanını price TextBox s Text alanına bağlarkenUnitPrice, bunu bir para birimi değeri ( ), genel bir sayı (){0:C}{0:N} olarak biçimlendirebilir veya biçimlendirilmemiş olarak bırakabilirsiniz.

ProductName ve UnitPrice Veri Alanlarını TextBoxes Metin Özelliklerine Bağlama

Şekil 10: ve UnitPrice Veri Alanlarını Text TextBox'ların Özelliklerine Bağlama ProductName

Şekil 10'daki Veri Bağlamalarını Düzenle iletişim kutusunun GridView veya DetailsView'da TemplateField ya da FormView'daki bir şablon düzenlenirken bulunan İki yönlü veri bağlama onay kutusunu içermediğini görebilirsiniz. İki yönlü veri bağlama özelliği, giriş Web denetimine girilen değerin ilgili ObjectDataSource'a InsertParameters otomatik olarak atanmalarına veya veri eklerken veya UpdateParameters güncelleştirirken izin verir. DataList, bu öğreticinin ilerleyen bölümlerinde göreceğimiz gibi iki yönlü veri bağlamayı desteklemez. Kullanıcı değişikliklerini yaptıktan ve verileri güncelleştirmeye hazır olduktan sonra bu TextBoxes Text özelliklerine program aracılığıyla erişmemiz ve değerlerini sınıfta uygun UpdateProduct yönteme ProductsBLL geçirmemiz gerekir.

Son olarak, öğesine Güncelleştir ve İptal düğmeleri EditItemTemplateeklemeliyiz. Details DataList ile Ana/Ayrıntı Madde İşaretli Ana Kayıt Listesi Kullanma öğreticisinde gördüğümüz gibi, özelliği ayarlanmış bir Button, LinkButton veya ImageButton CommandName bir Repeater veya DataList içinde tıklandığında Repeater veya DataList ItemCommand olayı tetiklenir. DataList için özellik belirli bir değere ayarlanırsa CommandName ek bir olay da tetiklenebilir. Özel CommandName özellik değerleri arasında şunlar yer alır:

  • İptal olayı tetikler CancelCommand
  • Düzenle, olayı tetikler EditCommand
  • Güncelleştirme olayı tetikler UpdateCommand

Bu olayların olaya ek olarakItemCommand tetiklendiğini unutmayın.

EditItemTemplate Biri Güncelleştir, diğeri CommandName İptal olarak ayarlanmış iki Düğme Web denetimine ekleyin. Bu iki Düğme Web denetimi eklendikten sonra Tasarım Aracı aşağıdakine benzer görünmelidir:

Güncelleştir ve İptal düğmelerinin eklendiği DataList EditItemTemplate öğesini gösteren ekran görüntüsü.

Şekil 11: Öğesine Güncelleştirme ve İptal Düğmeleri EditItemTemplate Ekleme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

EditItemTemplate DataList bildirim temelli işaretlemeniz tamamlandıktan sonra aşağıdakine benzer görünmelidir:

<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>

5. Adım: Düzenleme Moduna Girmek için Tesisatı Ekleme

Bu noktada DataList'imizin kendi aracılığıyla EditItemTemplatetanımlanmış bir düzenleme arabirimi vardır; ancak şu anda sayfamızı ziyaret eden bir kullanıcının ürün bilgilerini düzenlemek istediğini belirtmesi için bir yol yoktur. Tıklandığında bu DataList öğesini düzenleme modunda işleyen her ürüne bir Düzenle düğmesi eklemeliyiz. Tasarım Aracı aracılığıyla veya bildirimli olarak öğesine bir Düzenle düğmesi ItemTemplateekleyerek başlayın. Düzenle düğmesinin CommandName özelliğini Düzenle olarak ayarladığınızdan emin olun.

Bu Düzenle düğmesini ekledikten sonra, sayfayı bir tarayıcı üzerinden görüntülemek için biraz bekleyin. Bu eklemeyle birlikte, her ürün listesinde bir Düzenle düğmesi bulunmalıdır.

Düzenle düğmesinin eklendiği DataList EditItemTemplate öğesini gösteren ekran görüntüsü.

Şekil 12: 'ye EditItemTemplate Güncelleştirme ve İptal Düğmeleri Ekleme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Düğmeye tıklanması geri göndermeye neden olur, ancak ürün listesini düzenleme moduna getirmez . Ürünü düzenlenebilir hale getirmek için şunları yapmamız gerekir:

  1. DataList s EditItemIndex özelliğini Düzenle düğmesine yeni tıklanan dizinine DataListItem ayarlayın.
  2. Verileri DataList'e yeniden bağlama. DataList yeniden işlendiğinde, DataListItemItemIndex DataList ile EditItemIndex karşılık gelen , kullanılarak EditItemTemplateişlenir.

Düzenle düğmesine tıklandığında DataList EditCommand olayı tetiklendiğinden, aşağıdaki kodla bir EditCommand olay işleyicisi oluşturun:

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

Olay işleyicisiEditCommand, düzenle düğmesine () tıklanan öğesine başvuru DataListItem içeren ikinci giriş parametresi olarak türünde DataListCommandEventArgs bir nesneye geçirilire.Item. Olay işleyicisi önce DataList'leri EditItemIndexItemIndex düzenlenebilir DataListItem olarak ayarlar ve ardından DataList yöntemini çağırarak verileri DataList'e DataBind() yeniden ekler.

Bu olay işleyicisini ekledikten sonra sayfayı tarayıcıda yeniden ziyaret edin. Düzenle düğmesine tıkladığınızda tıklanan ürün düzenlenebilir hale gelir (bkz. Şekil 13).

Düzenle Düğmesine Tıklanması Ürünü Düzenlenebilir Hale Getirir

Şekil 13: Düzenle Düğmesine Tıklanması Ürünü Düzenlenebilir Yapar (Tam boyutlu resmi görüntülemek için tıklayın)

6. Adım: Kullanıcının Değişikliklerini Kaydetme

Düzenlenen ürünün Güncelleştir veya İptal düğmelerine tıklanması şu anda hiçbir şey yapmaz; bu işlevi eklemek için DataList ve UpdateCommandCancelCommand olayları için olay işleyicileri oluşturmamız gerekir. İlk olarak, düzenlenen ürünün İptal düğmesine tıklandığında ve DataList'i düzenleme öncesi durumuna döndürme görevi verildiğinde yürütülecek olay işleyicisini oluşturarak CancelCommand başlayın.

DataList'in tüm öğelerini salt okunur modda işlemesini sağlamak için şunları yapmamız gerekir:

  1. DataList s EditItemIndex özelliğini var DataListItem olmayan bir dizinin dizinine ayarlayın. -1, dizinler konumundan 0başladığından DataListItem güvenli bir seçimdir.
  2. Verileri DataList'e yeniden bağlama. DataList'in EditItemIndexöğesine karşılık gelen bir es olmadığından DataListItemItemIndex DataList'in tamamı salt okunur modda işlenir.

Bu adımlar aşağıdaki olay işleyici koduyla gerçekleştirilebilir:

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

Bu eklemeyle, İptal düğmesine tıklanması DataList'i düzenleme öncesi durumuna döndürür.

Tamamlamamız gereken son olay işleyicisi olay işleyicisidir UpdateCommand . Bu olay işleyicinin yapması gerekenler:

  1. Program aracılığıyla, kullanıcı tarafından girilen ürün adına ve fiyatına ve düzenlenen ürünün adına erişin ProductID.
  2. sınıfında uygun UpdateProduct aşırı yüklemeyi ProductsBLL çağırarak güncelleştirme işlemini başlatın.
  3. DataList s EditItemIndex özelliğini var DataListItem olmayan bir dizinin dizinine ayarlayın. -1, dizinler konumundan 0başladığından DataListItem güvenli bir seçimdir.
  4. Verileri DataList'e yeniden bağlama. DataList'in EditItemIndexöğesine karşılık gelen bir es olmadığından DataListItemItemIndex DataList'in tamamı salt okunur modda işlenir.

1. ve 2. adımlar kullanıcının değişikliklerini kaydetmekle sorumludur; 3. ve 4. adımlar, değişiklikler kaydedildikten sonra DataList'i düzenleme öncesi durumuna döndürür ve olay işleyicisinde CancelCommand gerçekleştirilen adımlarla aynıdır.

Güncelleştirilmiş ürün adını ve fiyatını almak için yöntemini kullanarak FindControl içindeki EditItemTemplateTextBox Web denetimlerine program aracılığıyla başvurmamız gerekir. Ayrıca, düzenlenen ürünün ProductID değerini de almalıyız. Başlangıçta ObjectDataSource'u DataList'e bağladığımızda, Visual Studio DataList s DataKeyField özelliğini veri kaynağından ( birincil anahtar değerine atadıProductID. Bu değer daha sonra DataList DataKeys koleksiyonundan alınabilir. Özelliğin gerçekten olarak ayarlandığından DataKeyField emin olmak için ProductIDbiraz zaman ayırın.

Aşağıdaki kod dört adımı uygular:

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

Olay işleyicisi, koleksiyondaki DataKeys düzenlenmiş ürünleri ProductID okuyarak başlar. Ardından, içindeki EditItemTemplate iki TextBox'a başvurulur ve özellikleri Text yerel değişkenlerde productNameValue depolanır ve unitPriceValue. Girilen değerin Decimal.Parse() para birimi simgesi varsa, yine de doğru bir Decimal değere dönüştürülebilmesi için TextBox'tan UnitPrice değeri okumak için yöntemini kullanırız.

Not

textBoxes Text özelliklerinde belirtilen bir değer ProductName varsa, ve UnitPrice TextBoxes değerleri yalnızca productNameValue ve unitPriceValue değişkenlerine atanır. Aksi takdirde, verileri bir veritabanı NULL değeriyle Nothing güncelleştirme etkisi olan değişkenleri için değeri kullanılır. Yani, kodumuz boş dizeleri veritabanı NULL değerlerine dönüştürür. Bu, GridView, DetailsView ve FormView denetimlerindeki düzenleme arabiriminin varsayılan davranışıdır.

Değerleri okuduktan sonra sınıfın ProductsBLLUpdateProduct yöntemi çağrılır ve ürünün adı, fiyatı ve ProductIDgeçirilir. Olay işleyicisi, olay işleyicisinde olduğu gibi CancelCommand tam olarak aynı mantığı kullanarak DataList'i ön düzenleme durumuna döndürerek tamamlar.

EditCommand, CancelCommandve UpdateCommand olay işleyicileri tamamlandıktan sonra, ziyaretçi bir ürünün adını ve fiyatını düzenleyebilir. Şekil 14-16'da bu düzenleme iş akışı çalışırken gösterilir.

Sayfayı İlk Ziyaret Ettiğinizde Tüm Ürünler Read-Only Modundadır

Şekil 14: Sayfayı İlk Kez Ziyaret Ettiğinizde Tüm Ürünler Read-Only Modundadır (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Bir Ürünün Adını veya Fiyatını Güncelleştirmek için Düzenle Düğmesine Tıklayın

Şekil 15: Bir Ürünün Adını veya Fiyatını Güncelleştirmek için Düzenle Düğmesine Tıklayın (Tam boyutlu resmi görüntülemek için tıklayın)

Değeri Değiştirdikten Sonra Güncelleştir'e tıklayarak Read-Only Moduna dönün

Şekil 16: Değeri Değiştirdikten Sonra, Read-Only Moduna Dönmek için Güncelleştir'e tıklayın (tam boyutlu görüntüyü görüntülemek için tıklayın)

7. Adım: Silme Özellikleri Ekleme

DataList'e silme özellikleri ekleme adımları, düzenleme özellikleri ekleme adımlarına benzer. Kısacası, tıklandığında bu düğmeye ItemTemplate bir Sil düğmesi eklememiz gerekir:

  1. Koleksiyon aracılığıyla DataKeys ilgili üründe ProductID okur.
  2. sınıfının DeleteProduct yöntemini çağırarak silme işlemini ProductsBLL gerçekleştirir.
  3. Verileri DataList'e yeniden ekler.

öğesine bir Sil düğmesi ItemTemplateekleyerek başlayalım.

Tıklandığında, Düzenle, Güncelleştir veya İptal olan CommandName bir Düğme DataList'in ItemCommand olayını ek bir olayla birlikte oluşturur (örneğin, Olayı düzenle EditCommand kullanıldığında da tetikler). Benzer şekilde, DataList'teki özelliği Delete olarak ayarlanmış tüm CommandName Button, LinkButton veya ImageButton, olayın tetiklemesini DeleteCommand (ile ItemCommandbirlikte) neden olur.

içindeki Düzenle düğmesinin yanına bir Sil düğmesi ekleyin ve bu düğmenin ItemTemplateözelliğini Sil olarak ayarlayın CommandName . Bu Düğme denetimini ekledikten sonra DataList'inizin ItemTemplate bildirim temelli söz dizimi şöyle görünmelidir:

<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>

Ardından, aşağıdaki kodu kullanarak DataList DeleteCommand olayı için bir olay işleyicisi oluşturun:

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

Sil düğmesine tıklanması geri göndermeye neden olur ve DataList DeleteCommand olayını tetikler. Olay işleyicisinde, tıklanan ürünün ProductID değerine koleksiyondan DataKeys erişilir. Ardından, sınıfın DeleteProduct yöntemi çağrılarak ProductsBLL ürün silinir.

Ürünü sildikten sonra verileri DataList ()DataList1.DataBind() öğesine yeniden bağlamamız önemlidir, aksi takdirde DataList yeni silinen ürünü göstermeye devam eder.

Özet

DataList noktası ve tıklama düzenleme ve gridview tarafından beğenilen silme desteği eksik olsa da, kısa bir kod ile bu özellikleri içerecek şekilde geliştirilebilir. Bu öğreticide silinebilen ve adı ve fiyatı düzenlenebilen ürünlerin iki sütunlu bir listesinin nasıl oluşturulacağını gördük. Düzenleme ve silme desteği eklemek, ve EditItemTemplateiçinde uygun Web denetimlerini ItemTemplate dahil etmek, ilgili olay işleyicilerini oluşturmak, kullanıcı tarafından girilen ve birincil anahtar değerlerini okumak ve İş Mantığı Katmanı ile birlikte çalışmayla ilgili bir konudur.

DataList'e temel düzenleme ve silme özellikleri eklemiş olsak da daha gelişmiş özelliklere sahip değil. Örneğin, giriş alanı doğrulaması yoktur. Bir kullanıcı Çok pahalı bir fiyat girerse, Çok pahalı değerini 'a dönüştürmeye çalışırken tarafından Decimal.Parse bir Decimalözel durum oluşturulur. Benzer şekilde, İş Mantığı veya Veri Erişim Katmanları'ndaki verileri güncelleştirmede bir sorun varsa kullanıcıya standart hata ekranı gösterilir. Sil düğmesinde herhangi bir onay olmadan, bir ürünü yanlışlıkla silme olasılığı çok yüksektir.

Sonraki öğreticilerde, düzenleme kullanıcı deneyimini nasıl geliştirebileceğimizi göreceğiz.

Mutlu Programlama!

Yazar hakkında

Yedi ASP/ASP.NET kitabının yazarı ve 4GuysFromRolla.com kurucusu Scott Mitchell, 1998'den beri Microsoft Web teknolojileriyle çalışmaktadır. Scott bağımsız bir danışman, eğitmen ve yazar olarak çalışmaktadır. Son kitabı Sams Teach Yourself ASP.NET 24 Hours 2.0'dır. Adresine adresinden veya adresinden ulaşabileceğiniz http://ScottOnWriting.NETblogu aracılığıyla ulaşabilirsinizmitchell@4GuysFromRolla.com.

Özel Teşekkürler

Bu öğretici serisi birçok yararlı gözden geçiren tarafından gözden geçirildi. Bu öğreticinin baş gözden geçirenleri Zack Jones, Ken Pespisa ve Randy Schmidt'tir. Yaklaşan MSDN makalelerimi gözden geçirmek istiyor musunuz? Öyleyse, bana adresinden bir satır mitchell@4GuysFromRolla.combırakın.