Düzenleme ve Ekleme Arabirimlerine Doğrulama Denetimleri Ekleme (C#)

tarafından Scott Mitchell

PDF’yi İndir

Bu öğreticide, daha kusursuz bir kullanıcı arabirimi sağlamak için veri Web denetiminin EditItemTemplate ve InsertItemTemplate öğelerine doğrulama denetimleri eklemenin ne kadar kolay olduğunu göreceğiz.

Giriş

Son üç öğreticide incelediğimiz örneklerde yer alan GridView ve DetailsView denetimlerinin tümü BoundFields ve CheckBoxFields'den oluşmaktadır (GridView veya DetailsView'ı akıllı etiket aracılığıyla bir veri kaynağı denetimine bağlarken Visual Studio tarafından otomatik olarak eklenen alan türleri). GridView veya DetailsView'da bir satırı düzenlerken, salt okunur olmayan boundField'ler metin kutularına dönüştürülür ve son kullanıcı mevcut verileri değiştirebilir. Benzer şekilde, bir DetailsView denetimine yeni kayıt eklerken, özelliği (varsayılan) olarak ayarlanan true BoundField'lerInsertVisible, kullanıcının yeni kaydın alan değerlerini sağlayabilecekleri boş metin kutuları olarak işlenir. Benzer şekilde, standart, salt okunur arabirimde devre dışı bırakılan CheckBoxField'ler, düzenleme ve ekleme arabirimlerinde etkin onay kutularına dönüştürülür.

BoundField ve CheckBoxField için varsayılan düzenleme ve ekleme arabirimleri yararlı olabilir, ancak arabirimde herhangi bir doğrulama yok. Kullanıcı bir veri girişi hatası yaparsa ( örneğin, alanı atlar ProductName veya için geçersiz bir değer UnitsInStock (-50 gibi) girerse, uygulama mimarisinin derinliklerinden bir özel durum oluşturulur. Bu özel durum önceki öğreticide gösterildiği gibi düzgün bir şekilde işlense de, ideal olarak kullanıcı arabiriminin düzenlenmesi veya eklenmesi, kullanıcının bu tür geçersiz verileri ilk etapta girmesini önlemek için doğrulama denetimleri içerir.

Özelleştirilmiş bir düzenleme veya ekleme arabirimi sağlamak için BoundField veya CheckBoxField'i TemplateField ile değiştirmemiz gerekir. DetailsView Denetimi öğreticilerindeki GridView Denetiminde TemplateField kullanma ve TemplateField kullanma konu başlığı olan TemplateFields, farklı satır durumları için ayrı arabirimler tanımlayan birden çok şablondan oluşabilir. TemplateField'ler ItemTemplate DetailsView veya GridView denetimlerinde salt okunur alanları veya satırları işlerken kullanılırken EditItemTemplate ve InsertItemTemplate sırasıyla düzenleme ve ekleme modları için kullanılacak arabirimleri gösterir.

Bu öğreticide TemplateField'lere EditItemTemplate doğrulama denetimleri eklemenin ve InsertItemTemplate daha kusursuz bir kullanıcı arabirimi sağlamanın ne kadar kolay olduğunu göreceğiz. Özellikle, bu öğretici Ekleme, Güncelleştirme ve Silme ile İlişkili Olayları inceleme öğreticisinde oluşturulan örneği alır ve uygun doğrulamayı içerecek şekilde düzenleme ve ekleme arabirimlerini genişleter.

1. Adım:Ekleme, Güncelleştirme ve Silme ile İlişkili Olayları incelemeden Örneği Çoğaltma

Ekleme, Güncelleştirme ve Silme ile İlişkili Olayları İnceleme öğreticisinde, düzenlenebilir bir GridView'da ürünlerin adlarını ve fiyatlarını listeleyen bir sayfa oluşturduk. Ayrıca, sayfa özelliği olarak Insertayarlanmış bir DetailsView DefaultMode içeriyordu, böylece her zaman ekleme modunda işleniyordu. Bu DetailsView'dan, kullanıcı yeni bir ürünün adını ve fiyatını girebilir, Ekle'ye tıklayabilir ve sisteme eklenmesini sağlayabilir (bkz. Şekil 1).

Önceki Örnek Kullanıcıların Yeni Ürünler Eklemesine ve Mevcut Ürünleri Düzenlemesine Olanak Tanır

Şekil 1: Önceki Örnek Kullanıcıların Yeni Ürünler Eklemesine ve Mevcut Ürünleri Düzenlemesine İzin Verir (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Bu öğreticideki hedefimiz, doğrulama denetimleri sağlamak için DetailsView ve GridView'ı artırmaktır. Özellikle doğrulama mantığımız şunları yapacaktır:

  • Ürün eklerken veya düzenlerken adın sağlanmasını gerektir
  • Kayıt eklerken fiyatın sağlanmasını zorunlu kılar; kaydı düzenlerken yine de bir fiyat gerektireceğiz, ancak gridview'un RowUpdating önceki öğreticide zaten mevcut olan olay işleyicisindeki program mantığını kullanacağız
  • Fiyat için girilen değerin geçerli bir para birimi biçimi olduğundan emin olun

Önceki örneği doğrulamayı içerecek şekilde artırmaya göz atabilmek için önce örneği bu öğreticinin UIValidation.aspxsayfasından DataModificationEvents.aspx sayfasına çoğaltmamız gerekir. Bunu başarmak için hem sayfanın bildirim temelli işaretlemesinin hem de kaynak kodunun DataModificationEvents.aspx üzerine kopyalamamız gerekir. Aşağıdaki adımları gerçekleştirerek bildirim temelli işaretlemenin üzerine ilk olarak kopyalayın:

  1. Visual Studio'da sayfayı DataModificationEvents.aspx açma
  2. Sayfanın bildirim temelli işaretlemesine gidin (sayfanın altındaki Kaynak düğmesine tıklayın)
  3. Şekil 2'de gösterildiği gibi ve </asp:Content> etiketlerinin <asp:Content> (3 ile 44. satırlar) içindeki metni kopyalayın.

asp:Content> Denetimindeki <Metni Kopyalama

Şekil 2: Denetimdeki <asp:Content> Metni Kopyalama (Tam boyutlu resmi görüntülemek için tıklayın)

  1. Sayfayı UIValidation.aspx açma
  2. Sayfanın bildirim temelli işaretlemesine gitme
  3. Denetimin içindeki metni yapıştırın <asp:Content> .

Kaynak kodun üzerine kopyalamak için sayfayı DataModificationEvents.aspx.cs açın ve yalnızca sınıfın EditInsertDelete_DataModificationEventsiçindeki metni kopyalayın. Üç olay işleyicisini (Page_Load, GridView1_RowUpdatingve ObjectDataSource1_Inserting) kopyalayın, ancak sınıf bildirimini veya using deyimlerini kopyalamayın. Kopyalanan metni içindeki sınıfının UIValidation.aspx.csiçineEditInsertDelete_UIValidation yapıştırın.

uygulamasından öğesine içerik ve kod üzerinden geçtikten DataModificationEvents.aspxUIValidation.aspxsonra, ilerlemenizi bir tarayıcıda test etmek için biraz zaman ayırın. Aynı çıkışı görmeniz ve bu iki sayfanın her birinde aynı işlevi görmeniz gerekir (ekran görüntüsü DataModificationEvents.aspx için şekil 1'e bakın).

2. Adım: BoundFields'ı TemplateFields'e Dönüştürme

Düzenleme ve ekleme arabirimlerine doğrulama denetimleri eklemek için DetailsView ve GridView denetimleri tarafından kullanılan BoundField'lerin TemplateFields'e dönüştürülmesi gerekir. Bunu başarmak için, sırasıyla GridView ve DetailsView'ın akıllı etiketlerindeki Sütunları Düzenle ve Alanları Düzenle bağlantılarına tıklayın. Burada, BoundField'lerin her birini seçin ve "Bu alanı TemplateField'e dönüştür" bağlantısına tıklayın.

DetailsView'ın ve GridView'un BoundField'larının Her Birini ŞablonAlanlarına Dönüştürme

Şekil 3: DetailsView'ın ve GridView'un BoundField'lerinin Her Birini ŞablonAlanlarına Dönüştürme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Alanlar iletişim kutusu aracılığıyla bir BoundField'i TemplateField'e dönüştürmek, BoundField'in kendisi ile aynı salt okunur, düzenleme ve ekleme arabirimlerini gösteren bir TemplateField oluşturur. Aşağıdaki işaretleme, DetailsView alanının TemplateField'a dönüştürüldükten sonra bildirim temelli söz dizimini ProductName gösterir:

<asp:TemplateField HeaderText="ProductName" SortExpression="ProductName">
    <EditItemTemplate>
        <asp:TextBox ID="TextBox1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
    </EditItemTemplate>
    <InsertItemTemplate>
        <asp:TextBox ID="TextBox1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
    </InsertItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

Bu TemplateField'de otomatik olarak , EditItemTemplateve InsertItemTemplateüç şablonun oluşturulduğunu ItemTemplateunutmayın. bir ItemTemplate Etiket Web denetimi kullanarak tek bir veri alanı değeri (ProductName) görüntülerken EditItemTemplate , ve InsertItemTemplate veri alanı değerini iki yönlü veri bağlama kullanarak TextBox'ın Text özelliğiyle ilişkilendiren bir TextBox Web denetiminde sunar. Bu sayfadaki DetailsView'ı yalnızca ekleme için kullandığımızdan, ve EditItemTemplate değerlerini iki TemplateField'den kaldırabilirsinizItemTemplate, ancak bunları bırakmanın bir sakıncası yoktur.

GridView, DetailsView'un yerleşik ekleme özelliklerini desteklemediğinden GridView'un ProductName alanını TemplateField'e dönüştürmek yalnızca ve ItemTemplateEditItemTemplateile sonuçlandırılıyor:

<asp:TemplateField HeaderText="ProductName" SortExpression="ProductName">
    <EditItemTemplate>
        <asp:TextBox ID="TextBox1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
          Text='<%# Bind("ProductName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

Visual Studio, "Bu alanı TemplateField'e dönüştür" seçeneğine tıklayarak, şablonları dönüştürülen BoundField kullanıcı arabirimini taklit eden bir TemplateField oluşturmuştur. Bu sayfayı tarayıcı üzerinden ziyaret ederek bunu doğrulayabilirsiniz. Bunun yerine BoundFields kullanıldığında TemplateFields görünümünün ve davranışının deneyimle aynı olduğunu göreceksiniz.

Not

Şablonlardaki düzenleme arabirimlerini gerektiği gibi özelleştirebilirsiniz. Örneğin, TemplateFields içindeki TextBox'ın metin kutusundan UnitPrice daha küçük bir metin kutusu olarak işlenmesini ProductName isteyebiliriz. Bunu yapmak için TextBox'ın Columns özelliğini uygun bir değere ayarlayabilir veya özelliği aracılığıyla Width mutlak genişlik sağlayabilirsiniz. Sonraki öğreticide, TextBox'ı alternatif bir veri girişi Web denetimiyle değiştirerek düzenleme arabirimini tamamen nasıl özelleştirebileceğimizi göreceğiz.

3. Adım: GridView'laraEditItemTemplate Doğrulama Denetimleri Ekleme

Veri girişi formları oluştururken, kullanıcıların gerekli alanları girmesi ve sağlanan tüm girişlerin yasal, düzgün biçimlendirilmiş değerler olması önemlidir. Kullanıcının girişlerinin geçerli olduğundan emin olmak için ASP.NET, tek bir giriş denetiminin değerini doğrulamak için kullanılmak üzere tasarlanmış beş yerleşik doğrulama denetimi sağlar:

Bu beş denetim hakkında daha fazla bilgi için ASP.NET Hızlı Başlangıç Öğreticileri'ninDoğrulama Denetimleri bölümüne bakın.

Öğreticimiz için DetailsView ve GridView'un TemplateField'lerinde bir RequiredFieldValidator ve DetailsView'ın ProductName TemplateField içindeki RequiredFieldValidator'ı UnitPrice kullanmamız gerekir. Ayrıca, girilen fiyatın 0'dan büyük veya buna eşit bir değere sahip olmasını ve geçerli bir para birimi biçiminde sunulmasını sağlayan her iki denetimin UnitPrice TemplateField değerlerine bir CompareValidator eklememiz gerekir.

Not

ASP.NET 1.x'te bu beş doğrulama denetimi olsa da, ASP.NET 2.0 bir dizi geliştirme eklemiştir. Ana ikisi Internet Explorer dışındaki tarayıcılar için istemci tarafı betik desteği ve sayfadaki doğrulama denetimlerini doğrulama gruplarına bölümleme özelliğidir.

GridView'un TemplateFields içindeki öğesine gerekli doğrulama denetimlerini EditItemTemplate ekleyerek başlayalım. Bunu yapmak için GridView'un akıllı etiketinden Şablonları Düzenle bağlantısına tıklayarak şablon düzenleme arabirimini açın. Buradan, açılan listeden hangi şablonun düzenlenebileceğini seçebilirsiniz. Düzenleme arabirimini artırmak istediğimiz için ve'lere ProductNameUnitPriceEditItemTemplate doğrulama denetimleri eklememiz gerekir.

ProductName ve UnitPrice'ın EditItemTemplates Öğelerini Genişletmemiz Gerekiyor

Şekil 4: ve'leri ProductNameUnitPriceEditItemTemplate Genişletmemiz Gerekiyor (Tam boyutlu görüntüyü görüntülemek için tıklayın)

ProductNameEditItemTemplateiçinde, Araç Kutusu'ndan şablon düzenleme arabirimine sürükleyip TextBox'ın arkasına yerleştirerek bir RequiredFieldValidator ekleyin.

ProductName EditItemTemplate'a RequiredFieldValidator ekleme

Şekil 5: öğesine bir RequiredFieldValidator ProductNameEditItemTemplate ekleme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Tüm doğrulama denetimleri, tek bir ASP.NET Web denetiminin girişini doğrulayarak çalışır. Bu nedenle, yeni eklediğimiz RequiredFieldValidator'ın içindeki TextBox'a EditItemTemplategöre doğrulanması gerektiğini belirtmemiz gerekir; bu, doğrulama denetiminin ControlToValidate özelliğiniID uygun Web denetiminin değerine ayarlayarak gerçekleştirilir. TextBox şu anda oldukça nodescript IDTextBox1değerine sahiptir, ancak şimdi bunu daha uygun bir şeyle değiştirelim. Şablonda TextBox'a tıklayın ve Özellikler penceresi öğesini olarak TextBox1EditProductNamedeğiştirinID.

TextBox'ın kimliğini EditProductName olarak değiştirme

Şekil 6: TextBox'ları IDEditProductName olarak değiştirin (Tam boyutlu resmi görüntülemek için tıklayın)

Ardından RequiredFieldValidator özelliğini ControlToValidate olarak EditProductNameayarlayın. Son olarak ErrorMessage özelliğini "Ürünün adını sağlamanız gerekir" ve Text özelliğini "*" olarak ayarlayın. Text Özellik değeri (sağlanırsa), doğrulama başarısız olursa doğrulama denetimi tarafından görüntülenen metindir. ErrorMessage Gerekli olan özellik değeri ValidationSummary denetimi tarafından kullanılır; Text özellik değeri atlanırsa, ErrorMessage özellik değeri aynı zamanda geçersiz girişte doğrulama denetimi tarafından görüntülenen metindir.

RequiredFieldValidator'ın bu üç özelliğini ayarladıktan sonra ekranınız Şekil 7'ye benzer görünmelidir.

RequiredFieldValidator'ın ControlToValidate, ErrorMessage ve Metin Özelliklerini Ayarlama

Şekil 7: RequiredFieldValidator'ın ControlToValidate, ErrorMessageve Text Özelliklerini ayarlama (Tam boyutlu görüntüyü görüntülemek için tıklayın)

RequiredFieldValidator öğesine eklendiğinde ProductNameEditItemTemplategeriye kalan tek şey gerekli doğrulamayı öğesine UnitPriceEditItemTemplateeklemektir. Bu sayfada UnitPrice , kaydı düzenlerken isteğe bağlı olduğuna karar verdik. RequiredFieldValidator eklememiz gerekmez. Ancak, sağlanırsa, para birimi olarak düzgün biçimlendirildiğinden UnitPriceve 0'dan büyük veya buna eşit olduğundan emin olmak için bir CompareValidator eklememiz gerekir.

CompareValidator öğesini öğesine UnitPriceEditItemTemplateeklemeden önce TextBox Web denetiminin kimliğini olarak TextBox2EditUnitPricedeğiştirelim. Bu değişikliği yaptıktan sonra CompareValidator öğesini ekleyin, özelliğini EditUnitPriceolarak ayarlayınControlToValidate, ErrorMessage özelliğini "Fiyat sıfırdan büyük veya buna eşit olmalı ve para birimi simgesini içeremez" ve Text özelliğini "*" olarak ayarlayın.

Değerin UnitPrice 0'dan büyük veya 0'a eşit olması gerektiğini belirtmek için CompareValidator'ın Operator özelliğiniGreaterThanEqualolarak, ValueToCompare özelliğini "0" ve Type özelliğini olarak Currencyayarlayın. Aşağıdaki bildirim temelli söz dizimi, bu değişiklikler yapıldıktan sonra TemplateField'leri EditItemTemplate gösterirUnitPrice:

<EditItemTemplate>
    <asp:TextBox ID="EditUnitPrice" runat="server"
      Text='<%# Bind("UnitPrice", "{0:c}") %>'
      Columns="6"></asp:TextBox>
    <asp:CompareValidator ID="CompareValidator1" runat="server"
        ControlToValidate="EditUnitPrice"
        ErrorMessage="The price must be greater than or equal to zero and
                       cannot include the currency symbol"
        Operator="GreaterThanEqual" Type="Currency"
        ValueToCompare="0">*</asp:CompareValidator>
</EditItemTemplate>

Bu değişiklikleri yaptıktan sonra sayfayı bir tarayıcıda açın. Bir ürünü düzenlerken adı atlamayı veya geçersiz bir fiyat değeri girmeyi denerseniz, metin kutusunun yanında bir yıldız işareti görünür. Şekil 8'de gösterildiği gibi, 19,95 ABD doları gibi para birimi simgesini içeren bir fiyat değeri geçersiz kabul edilir. CompareValidator'lar CurrencyType basamak ayırıcılarına (kültür ayarlarına bağlı olarak virgül veya nokta gibi) ve baştaki artı veya eksi işaretine izin verir, ancak para birimi simgesine izin vermez . Düzenleme arabirimi şu anda para birimi biçimini kullanarak işledikçe UnitPrice bu davranış kullanıcıların kafalarını çözebilir.

Not

Ekleme, Güncelleştirme ve Silme ile İlişkili Olaylar öğreticisinde, boundField DataFormatString özelliğini para birimi olarak biçimlendirmek {0:c} için olarak ayarlamış olduğumuzu hatırlayın. Ayrıca özelliğini true olarak ayarlayarak ApplyFormatInEditMode GridView'un düzenleme arabiriminin değerini para birimi olarak biçimlendirmesine UnitPrice neden olduk. BoundField'i TemplateField'e dönüştürürken Visual Studio bu ayarları not etti ve TextBox özelliğini Text veri bağlama söz dizimini kullanarak para birimi olarak biçimlendirdi <%# Bind("UnitPrice", "{0:c}") %>.

Geçersiz Girişli Metin Kutularının Yanında Yıldız Işareti Görünür

Şekil 8: Geçersiz Girişli Metin Kutularının Yanında Yıldız Işareti Görünüyor (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Doğrulama olduğu gibi çalışsa da, kullanıcının kaydı düzenlerken para birimi simgesini el ile kaldırması gerekir ve bu kabul edilemez. Bunu düzeltmek için üç seçeneğimiz vardır:

  1. EditItemTemplate değerini, değerin UnitPrice para birimi olarak biçimlendirilmemesi için yapılandırın.
  2. CompareValidator'ı kaldırıp düzgün biçimlendirilmiş bir para birimi değerini doğru şekilde denetlemiş bir RegularExpressionValidator ile değiştirerek kullanıcının para birimi simgesi girmesine izin verin. Buradaki sorun, bir para birimi değerini doğrulamaya ilişkin normal ifadenin güzel olmaması ve kültür ayarlarını birleştirmek istiyorsak kod yazmanın gerekmesidir.
  3. Doğrulama denetimini tamamen kaldırın ve GridView'un RowUpdating olay işleyicisinde sunucu tarafı doğrulama mantığına güvenin.

Bu alıştırma için 1. seçeneği kullanalım. Şu anda içindeki UnitPrice TextBox EditItemTemplateiçin veri bağlama ifadesi nedeniyle para birimi olarak biçimlendirilmiştir. <%# Bind("UnitPrice", "{0:c}") %> Bind deyimini Bind("UnitPrice", "{0:n2}")olarak değiştirin. Bu, sonucu iki duyarlık basamaklı bir sayı olarak biçimlendirir. Bu, doğrudan bildirim temelli söz dizimi aracılığıyla veya TemplateField'lerdeki EditItemTemplate TextBox'taki EditUnitPriceUnitPrice Veri Bağlamalarını Düzenle bağlantısına tıklayarak yapılabilir (bkz. Şekil 9 ve 10).

TextBox'ın Veri Bağlamalarını Düzenle bağlantısına tıklayın

Şekil 9: TextBox'ın Veri Bağlamalarını Düzenle bağlantısına tıklayın (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Bağlama Deyiminde Biçim Tanımlayıcısını Belirtme

Şekil 10: Deyimde Biçim Tanımlayıcısını Bind Belirtin (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Bu değişiklikle, düzenleme arabirimindeki biçimlendirilmiş fiyat grup ayırıcısı olarak virgül ve ondalık ayırıcı olarak nokta içerir, ancak para birimi simgesini bırakır.

Not

UnitPriceEditItemTemplate, geri göndermenin verilmesine ve güncelleştirme mantığının başlamasına izin veren bir RequiredFieldValidator içermez. Ancak, Ekleme, RowUpdatingGüncelleştirme ve Silme ile İlişkili Olayları inceleme öğreticisinden kopyalanan olay işleyicisi, öğesinin sağlandığından UnitPrice emin olan programlı bir denetim içerir. Bu mantığı kaldırabilir, olduğu gibi bırakabilir veya öğesine bir RequiredFieldValidator UnitPriceEditItemTemplateekleyebilirsiniz.

4. Adım: Veri Girişi Sorunlarını Özetleme

Beş doğrulama denetimine ek olarak, ASP.NET geçersiz veri algılayan bu doğrulama denetimlerinin s'lerini görüntüleyen ErrorMessageValidationSummary denetimini içerir. Bu özet verileri web sayfasında veya kalıcı, istemci tarafı ileti kutusu aracılığıyla metin olarak görüntülenebilir. Şimdi bu öğreticiyi, doğrulama sorunlarını özetleyen bir istemci tarafı ileti kutusu içerecek şekilde geliştirelim.

Bunu yapmak için Bir ValidationSummary denetimini Araç Kutusu'ndan Tasarım Aracı sürükleyin. Doğrulama denetiminin konumu önemli değildir, çünkü bunu yalnızca özeti ileti kutusu olarak görüntüleyecek şekilde yapılandıracağız. Denetimi ekledikten sonra ShowSummary özelliğinifalse ve ShowMessageBox özelliğini olarak trueayarlayın. Bu eklemeyle, tüm doğrulama hataları istemci tarafı ileti kutusunda özetlenir.

Doğrulama Hataları Client-Side İleti Kutusunda Özetlenir

Şekil 11: Doğrulama Hataları Client-Side İleti Kutusunda Özetlenir (Tam boyutlu görüntüyü görüntülemek için tıklayın)

5. Adım: DetailsView'a Doğrulama Denetimleri EklemeInsertItemTemplate

Bu öğreticide kalan tek şey, doğrulama denetimlerini DetailsView'ın ekleme arabirimine eklemektir. DetailsView şablonlarına doğrulama denetimleri ekleme işlemi, 3. Adımda incelenenle aynıdır; bu nedenle, bu adımda görevi kolayca tamamlayacağız. GridView'larda EditItemTemplate yaptığımız gibi, TextBoxes'ın s'lerini nondescript TextBox1 ve TextBox2InsertProductNameInsertUnitPriceile olarak yeniden adlandırmanızı ID öneririz.

öğesine bir RequiredFieldValidator ProductNameInsertItemTemplateekleyin. ControlToValidateID öğesini şablondaki TextBox değerine, Text özelliğini "*" ve ErrorMessage özelliğini "Ürünün adını sağlamanız gerekir" olarak ayarlayın.

UnitPrice yeni kayıt eklerken bu sayfa için gerekli olduğundan , ve ErrorMessage özelliklerini uygun şekilde ayarlayarak ControlToValidateTextöğesine bir RequiredFieldValidator UnitPriceInsertItemTemplateekleyin. Son olarak , , Text, ErrorMessageOperatorTypeve ValueToCompare özelliklerini gridView'un EditItemTemplateiçindeki 's CompareValidatorInsertItemTemplateUnitPriceile UnitPriceyaptığımız gibi yapılandırarak ControlToValidatebir CompareValidator ekleyin.

Bu doğrulama denetimlerini ekledikten sonra, adı sağlanmazsa veya fiyatı negatif bir sayıysa veya yasa dışı biçimlendirilmişse sisteme yeni bir ürün eklenemez.

DetailsView'un Ekleme Arabirimine Doğrulama Mantığı Eklendi

Şekil 12: DetailsView'ın Ekleme Arabirimine Doğrulama Mantığı Eklendi (Tam boyutlu görüntüyü görüntülemek için tıklayın)

6. Adım: Doğrulama Denetimlerini Doğrulama Gruplarına Bölme

Sayfamız iki mantıksal olarak farklı doğrulama denetimi kümesinden oluşur: GridView'un düzenleme arabirimine karşılık gelenler ve DetailsView'un ekleme arabirimine karşılık gelenler. Varsayılan olarak, geri gönderme gerçekleştiğinde sayfadaki tüm doğrulama denetimleri işaretlenir. Ancak, bir kaydı düzenlerken DetailsView'ın arabirim ekleme denetimlerinin doğrulamasını istemiyoruz. Şekil 13'te, kullanıcı ürünü mükemmel yasal değerlerle düzenlerken geçerli ikilemimiz gösterilmektedir. Ekleme arabirimindeki ad ve fiyat değerleri boş olduğundan Güncelleştir'e tıklamak doğrulama hatasına neden olur.

Bir Ürünü Güncelleştirme, Arabirim Ekleme Denetimlerinin Tetiklenmesine Neden Oluyor

Şekil 13: Bir Ürünü Güncelleştirme, Ekleme Arabiriminin Doğrulama Denetimlerinin Tetiklenmesine Neden Oluyor (Tam boyutlu görüntüyü görüntülemek için tıklayın)

ASP.NET 2.0'daki doğrulama denetimleri, özellikleri ValidationGroup aracılığıyla doğrulama gruplarına bölünebilir. Bir gruptaki doğrulama denetimleri kümesini ilişkilendirmek için, bunların ValidationGroup özelliğini aynı değere ayarlamanız yeterlidir. Öğreticimiz için, GridView'un TemplateFields EditValidationControls içindeki doğrulama denetimlerinin özelliklerini olarak, ValidationGroup DetailsView'un TemplateFields'inin InsertValidationControlsözelliklerini olarak ayarlayınValidationGroup. Bu değişiklikler, Tasarım Aracı düzenleme şablonu arabirimi kullanılırken doğrudan bildirim temelli işaretlemede veya Özellikler penceresi aracılığıyla yapılabilir.

Doğrulama denetimlerine ek olarak, ASP.NET 2.0'daki Düğme ve Düğmeyle ilgili denetimler de bir ValidationGroup özellik içerir. Doğrulama grubunun doğrulayıcıları, yalnızca aynı ValidationGroup özellik ayarına sahip bir Düğme tarafından geri gönderme tetiklendiğinde geçerlilik denetimi yapılır. Örneğin, DetailsView'un Ekle düğmesinin doğrulama grubunu tetiklemesi InsertValidationControls için CommandField ValidationGroup özelliğini InsertValidationControls olarak ayarlamamız gerekir (bkz. Şekil 14). Ayrıca GridView'un CommandField ValidationGroup özelliğini olarak EditValidationControlsayarlayın.

DetailsView'ın CommandField'in ValidationGroup özelliğini InsertValidationControls olarak ayarlayın

Şekil 14: DetailsView'un CommandField ValidationGroup özelliğini olarak InsertValidationControls ayarlayın (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Bu değişikliklerden sonra DetailsView ve GridView'un TemplateFields ve CommandFields değerleri aşağıdakine benzer görünmelidir:

DetailsView'ın TemplateFields ve CommandField

<asp:TemplateField HeaderText="ProductName"
  SortExpression="ProductName">
    <InsertItemTemplate>
        <asp:TextBox ID="InsertProductName" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator2"
          runat="server" ControlToValidate="InsertProductName"
            ErrorMessage="You must provide the product name"
            ValidationGroup="InsertValidationControls">*
        </asp:RequiredFieldValidator>
    </InsertItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="UnitPrice" SortExpression="UnitPrice">
    <InsertItemTemplate>
         <asp:TextBox ID="InsertUnitPrice" runat="server"
           Text='<%# Bind("UnitPrice") %>' Columns="6">
         </asp:TextBox>
         <asp:RequiredFieldValidator ID="RequiredFieldValidator3"
           runat="server" ControlToValidate="InsertUnitPrice"
            ErrorMessage="You must provide the product price"
            ValidationGroup="InsertValidationControls">*
         </asp:RequiredFieldValidator>
        <asp:CompareValidator ID="CompareValidator2" runat="server"
           ControlToValidate="InsertUnitPrice"
           ErrorMessage="The price must be greater than or equal to zero and
                          cannot include the currency symbol"
           Operator="GreaterThanEqual" Type="Currency" ValueToCompare="0"
           ValidationGroup="InsertValidationControls">*
        </asp:CompareValidator>
     </InsertItemTemplate>
 </asp:TemplateField>
<asp:CommandField ShowInsertButton="True"
  ValidationGroup="InsertValidationControls" />

GridView CommandField ve TemplateFields

<asp:CommandField ShowEditButton="True" ValidationGroup="EditValidationControls" />
<asp:TemplateField HeaderText="ProductName"
  SortExpression="ProductName">
    <EditItemTemplate>
        <asp:TextBox ID="EditProductName" runat="server"
          Text='<%# Bind("ProductName") %>'>
        </asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator1"
            runat="server" ControlToValidate="EditProductName"
            ErrorMessage="You must provide the product name"
            ValidationGroup="EditValidationControls">*
        </asp:RequiredFieldValidator>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
          Text='<%# Bind("ProductName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="UnitPrice" SortExpression="UnitPrice">
    <EditItemTemplate>
        <asp:TextBox ID="EditUnitPrice" runat="server"
          Text='<%# Bind("UnitPrice", "{0:n2}") %>' Columns="6"></asp:TextBox>
        <asp:CompareValidator ID="CompareValidator1" runat="server"
            ControlToValidate="EditUnitPrice"
            ErrorMessage="The price must be greater than or equal to zero and
                           cannot include the currency symbol"
            Operator="GreaterThanEqual" Type="Currency"
            ValueToCompare="0"
            ValidationGroup="EditValidationControls">*
        </asp:CompareValidator>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label2" runat="server"
            Text='<%# Bind("UnitPrice", "{0:c}") %>'>
        </asp:Label>
    </ItemTemplate>
</asp:TemplateField>

Bu noktada düzenlemeye özgü doğrulama denetimleri yalnızca GridView'un Güncelleştir düğmesine tıklandığında ve eklemeye özgü doğrulama denetimleri yalnızca DetailsView'un Ekle düğmesine tıklandığında tetiklendiğinde tetiklenerek Şekil 13'te vurgulanan sorun çözülmektedir. Ancak, bu değişiklikle birlikte Geçersiz veri girerken ValidationSummary denetimimiz artık görüntülenmez. ValidationSummary denetimi de bir ValidationGroup özellik içerir ve yalnızca doğrulama grubundaki bu doğrulama denetimleri için özet bilgileri gösterir. Bu nedenle, bu sayfada biri doğrulama grubu ve diğeri EditValidationControlsiçin olmak üzere InsertValidationControls iki doğrulama denetimine sahip olmamız gerekir.

<asp:ValidationSummary ID="ValidationSummary1" runat="server"
    ShowMessageBox="True" ShowSummary="False"
    ValidationGroup="EditValidationControls" />
<asp:ValidationSummary ID="ValidationSummary2" runat="server"
    ShowMessageBox="True" ShowSummary="False"
    ValidationGroup="InsertValidationControls" />

Bu ekleme ile öğreticimiz tamamlandı!

Özet

BoundFields hem ekleme hem de düzenleme arabirimi sağlayabilir, ancak arabirim özelleştirilebilir değildir. Genellikle, kullanıcının gerekli girişleri yasal bir biçimde girmesini sağlamak için düzenleme ve ekleme arabirimine doğrulama denetimleri eklemek istiyoruz. Bunu başarmak için BoundField'leri TemplateFields'e dönüştürmemiz ve doğrulama denetimlerini uygun şablonlara eklememiz gerekir. Bu öğreticide, Hem DetailsView'un ekleme arabirimine hem de GridView'un düzenleme arabirimine doğrulama denetimleri ekleyerek Ekleme , Güncelleştirme ve Silme ile İlişkili Olayları inceleme öğreticisindeki örneği genişlettik. Ayrıca ValidationSummary denetimini kullanarak özet doğrulama bilgilerinin nasıl görüntüleneceğini ve sayfadaki doğrulama denetimlerinin ayrı doğrulama gruplarına nasıl bölümleneceğini gördük.

Bu öğreticide gördüğümüz gibi TemplateFields, düzenleme ve ekleme arabirimlerinin doğrulama denetimlerini içerecek şekilde genişletilmesine izin verir. TemplateField'ler ek giriş Web denetimleri içerecek şekilde genişletilerek TextBox'ın daha uygun bir Web denetimiyle değiştirilmesini sağlayabilirsiniz. Sonraki öğreticimizde, TextBox denetimini veriye bağlı DropDownList denetimiyle nasıl değiştirebileceğimizi göreceğiz. Bu denetim, yabancı anahtarı düzenlerken (veya tablosunda) CategoryIDSupplierIDProducts idealdir.

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 Saat içinde 2.0. 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 Liz Shulok ve Zack Jones oldu. Yaklaşan MSDN makalelerimi gözden geçirmek istiyor musunuz? Öyleyse, bana bir satır mitchell@4GuysFromRolla.combırakın.