Verileri Temel Alan Özel Biçimlendirme (VB)

tarafından Scott Mitchell

PDF’yi İndir

GridView, DetailsView veya FormView biçimini ilişkili verilere göre ayarlamak birden çok şekilde gerçekleştirilebilir. Bu öğreticide DataBound ve RowDataBound olay işleyicilerini kullanarak veriye bağlı biçimlendirmeyi nasıl gerçekleştirebileceğimizi inceleyeceğiz.

Giriş

GridView, DetailsView ve FormView denetimlerinin görünümü, stille ilgili birçok özellik aracılığıyla özelleştirilebilir. , , Font, , BorderWidthWidthBorderStyleBorderColorve Heightgibi CssClassözellikler, işlenen denetimin genel görünümünü dikte eder. , RowStyle, AlternatingRowStyleve diğerleri gibi HeaderStyleözellikler, aynı stil ayarlarının belirli bölümlere uygulanmasına izin verir. Benzer şekilde, bu stil ayarları alan düzeyinde uygulanabilir.

Ancak birçok senaryoda biçimlendirme gereksinimleri, görüntülenen verilerin değerine bağlıdır. Örneğin, stokta olmayan ürünlere dikkat çekmek için, ürün bilgilerini listeleyen bir rapor, ve UnitsOnOrder alanları 0'a eşit olan UnitsInStock ürünler için arka plan rengini sarı olarak ayarlayabilir. Daha pahalı ürünleri vurgulamak için 75,00 ABD dolarından daha pahalı olan ürünlerin fiyatlarını kalın yazı tipinde görüntülemek isteyebiliriz.

GridView, DetailsView veya FormView biçimini ilişkili verilere göre ayarlamak birden çok şekilde gerçekleştirilebilir. Bu öğreticide ve RowDataBound olay işleyicilerinin kullanımıyla veriye bağlı biçimlendirmeyi nasıl gerçekleştirebileceğimizi DataBound inceleyeceğiz. Sonraki öğreticide alternatif bir yaklaşımı keşfedeceğiz.

DetailsView DenetimininDataBoundOlay İşleyicisini Kullanma

Veriler bir veri kaynağı denetiminden veya program aracılığıyla denetimin özelliğine veri atayarak ve yöntemini çağırarak DataBind() bir DetailsView'a DataSource bağlı olduğunda, aşağıdaki adım dizisi gerçekleşir:

  1. Veri Web denetiminin DataBinding olayı tetikler.
  2. Veriler, veri Web denetimine bağlıdır.
  3. Veri Web denetiminin DataBound olayı tetikler.

Özel mantık, bir olay işleyicisi aracılığıyla 1. ve 3. adımlardan hemen sonra eklenebilir. Olay için DataBound bir olay işleyicisi oluşturarak, veri Web denetimine bağlı verileri program aracılığıyla belirleyebilir ve biçimlendirmeyi gerektiği gibi ayarlayabiliriz. Bunu göstermek için, bir ürünle ilgili genel bilgileri listeleyen ancak değeri 75,00 TL'yi aşarsa kalın, italik yazı tipiyle görüntüleyen UnitPrice bir DetailsView oluşturalım.

1. Adım: Ürün Bilgilerini DetailsView'da Görüntüleme

Klasördeki sayfayı CustomColors.aspx açın, Araç Kutusu'ndan bir DetailsView denetimini Tasarım Aracı sürükleyin, özellik değerini olarak ExpensiveProductsPriceInBoldItalicayarlayın ID ve sınıfın GetProducts() yöntemini çağıran yeni bir ObjectDataSource denetimine ProductsBLL bağlayın.CustomFormatting Bunu gerçekleştirmek için ayrıntılı adımlar, önceki öğreticilerde ayrıntılı olarak incelediğimizden, kısa bir süre için burada atlanmıştır.

ObjectDataSource'ı DetailsView'a bağladıktan sonra alan listesini değiştirmek için biraz zaman ayırın. , , SupplierID, , CategoryID, UnitsOnOrderUnitsInStockReorderLevel, ve BoundField'leri kaldırmayı ProductIDseçtim ve Discontinued kalan BoundField'leri yeniden adlandırıp yeniden biçimlendirdim. Ve ayarlarını da temizledim WidthHeight . DetailsView yalnızca tek bir kayıt görüntülediğinden, son kullanıcının tüm ürünleri görüntülemesine izin vermek için sayfalama özelliğini etkinleştirmemiz gerekir. DetailsView'un akıllı etiketinde Sayfalama'yı Etkinleştir onay kutusunu işaretleyerek bunu yapın.

Şekil 1: DetailsView'ın Akıllı Etiketinde Sayfalandırmayı Etkinleştir Onay Kutusunu işaretleyin

Şekil 1: Şekil 1: DetailsView'ın Akıllı Etiketinde Sayfalandırmayı Etkinleştir Onay Kutusunu işaretleyin (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Bu değişikliklerden sonra DetailsView işaretlemesi şu şekilde olacaktır:

<asp:DetailsView ID="DetailsView1" runat="server" AllowPaging="True"
    AutoGenerateRows="False" DataKeyNames="ProductID"
    DataSourceID="ObjectDataSource1" EnableViewState="False">
    <Fields>
        <asp:BoundField DataField="ProductName" HeaderText="Product"
          SortExpression="ProductName" />
        <asp:BoundField DataField="CategoryName" HeaderText="Category"
          ReadOnly="True" SortExpression="CategoryName" />
        <asp:BoundField DataField="SupplierName" HeaderText="Supplier"
          ReadOnly="True" SortExpression="SupplierName" />
        <asp:BoundField DataField="QuantityPerUnit"
          HeaderText="Qty/Unit" SortExpression="QuantityPerUnit" />
        <asp:BoundField DataField="UnitPrice" DataFormatString="{0:c}"
          HeaderText="Price"
            HtmlEncode="False" SortExpression="UnitPrice" />
    </Fields>
</asp:DetailsView>

Tarayıcınızda bu sayfayı test etmek için biraz bekleyin.

DetailsView Denetimi Bir Kerede Bir Ürün Görüntüler

Şekil 2: DetailsView Denetimi Bir Kerede Bir Ürün Görüntüler (Tam boyutlu görüntüyü görüntülemek için tıklayın)

2. Adım: DataBound Olay İşleyicisindeki Verilerin Değerini Program Aracılığıyla Belirleme

Değeri 75,00 TL'yi aşan ürünlerin UnitPrice fiyatını kalın, italik yazı tipinde görüntülemek için önce değeri program aracılığıyla belirleyebilmemiz UnitPrice gerekir. DetailsView için bu işlem olay işleyicisinde DataBound gerçekleştirilebilir. Olay işleyicisini oluşturmak için Tasarım Aracı DetailsView öğesine tıklayın ve ardından Özellikler penceresi gidin. Görünür değilse F4 tuşuna basın veya Görünüm menüsüne gidip Özellikler Penceresi menü seçeneğini belirleyin. detailsView olaylarını listelemek için Özellikler penceresi şimşek simgesine tıklayın. Ardından, olaya çift tıklayın DataBound veya oluşturmak istediğiniz olay işleyicisinin adını yazın.

DataBound Olayı için Olay İşleyicisi Oluşturma

Şekil 3: Olay için Olay İşleyicisi DataBound Oluşturma

Not

Ayrıca ASP.NET sayfasının kod bölümünden bir olay işleyicisi de oluşturabilirsiniz. Burada, sayfanın en üstünde iki açılan liste bulabilirsiniz. Sol açılan listeden nesneyi seçin ve sağ açılan listeden işleyicisini oluşturmak istediğiniz olayı seçin; Visual Studio otomatik olarak uygun olay işleyicisini oluşturur.

Bunu yaptığınızda olay işleyicisi otomatik olarak oluşturulur ve sizi eklendiği kod bölümüne götürür. Bu noktada şunu görürsünüz:

Protected Sub ExpensiveProductsPriceInBoldItalic_DataBound _
    (sender As Object, e As System.EventArgs) _
    Handles ExpensiveProductsPriceInBoldItalic.DataBound
End Sub

DetailsView'a bağlı verilere özelliği aracılığıyla DataItem erişilebilir. Denetimlerimizi, kesin olarak türü belirlenmiş DataRow örneklerinden oluşan bir koleksiyondan oluşan kesin türe sahip bir DataTable'a bağladığımız hatırlayın. DataTable DetailsView'a bağlı olduğunda, DataTable'daki ilk DataRow DetailsView özelliğine DataItem atanır. Özellikle, özelliğine DataItem bir DataRowView nesne atanır. Aslında bir ProductsRow örnek olan temel DataRow nesnesine erişim elde etmek için 's Row özelliğini kullanabilirizDataRowView. Bu ProductsRow örneği aldıktan sonra, nesnenin özellik değerlerini inceleyerek kararımızı verebiliriz.

Aşağıdaki kod, DetailsView denetimine bağlı değerin UnitPrice 75,00 TL'den büyük olup olmadığının nasıl belirleneceğini gösterir:

Protected Sub ExpensiveProductsPriceInBoldItalic_DataBound _
    (sender As Object, e As System.EventArgs) _
    Handles ExpensiveProductsPriceInBoldItalic.DataBound

    Dim product As Northwind.ProductsRow = _
        CType(CType(ExpensiveProductsPriceInBoldItalic.DataItem, _
            System.Data.DataRowView).Row, Northwind.ProductsRow)
    If Not product.IsUnitPriceNull() AndAlso product.UnitPrice > 75 Then
    End If
End Sub

Not

UnitPrice Veritabanında bir NULL değer olabileceğinden, 'nin UnitPrice özelliğine erişmeden önce bir NULL değerle ilgilenmediğimizden ProductsRowemin olmak için kontrol ederiz. Bir değere sahip olduğunda özelliğine UnitPrice erişmeye çalışırsak nesne bir StrongTypingException özel durumu oluşturacağından bu denetim önemlidir.NULLProductsRow

3. Adım: DetailsView'da UnitPrice Değerini Biçimlendirme

Bu noktada DetailsView'a bağlı değerin UnitPrice 75,00 TL'yi aşan bir değere sahip olup olmadığını belirleyebiliriz, ancak DetailsView'un biçimlendirmesini buna göre program aracılığıyla nasıl ayarlayacağımızı henüz göremedik. DetailsView'da bir satırın tamamının biçimlendirmesini değiştirmek için kullanarak satıra DetailsViewID.Rows(index)program aracılığıyla erişin; belirli bir hücreyi değiştirmek için access kullanın DetailsViewID.Rows(index).Cells(index). Satıra veya hücreye başvurumuz olduğunda, stille ilgili özelliklerini ayarlayarak görünümünü ayarlayabiliriz.

Bir satıra program aracılığıyla erişmek için 0'da başlayan satırın dizinini bilmeniz gerekir. Satır UnitPrice , DetailsView'daki beşinci satırdır ve bu satıra 4 dizini verir ve kullanarak ExpensiveProductsPriceInBoldItalic.Rows(4)program aracılığıyla erişilebilir olmasını sağlar. Bu noktada, aşağıdaki kodu kullanarak satırın içeriğinin tamamını kalın, italik bir yazı tipinde görüntüleyebiliriz:

ExpensiveProductsPriceInBoldItalic.Rows(4).Font.Bold = True
ExpensiveProductsPriceInBoldItalic.Rows(4).Font.Italic = True

Ancak, bu hem etiketi (Fiyat) hem de değeri kalın ve italik yapar. Yalnızca değeri kalın ve italik yapmak istiyorsak, bu biçimlendirmeyi satırdaki ikinci hücreye uygulamamız gerekir; bu, aşağıdakiler kullanılarak gerçekleştirilebilir:

ExpensiveProductsPriceInBoldItalic.Rows(4).Cells(1).Font.Bold = True
ExpensiveProductsPriceInBoldItalic.Rows(4).Cells(1).Font.Italic = True

Öğreticilerimiz şimdiye kadar işlenmiş işaretleme ve stille ilgili bilgiler arasında temiz bir ayrım yapmak için stil sayfalarını kullandığından, yukarıda gösterildiği gibi belirli stil özelliklerini ayarlamak yerine css sınıfını kullanalım. Styles.css Stil sayfasını açın ve aşağıdaki tanıma sahip adlı ExpensivePriceEmphasis yeni bir CSS sınıfı ekleyin:

.ExpensivePriceEmphasis
{
    font-weight: bold;
    font-style: italic;
}

Ardından, olay işleyicisinde DataBound hücrenin CssClass özelliğini olarak ExpensivePriceEmphasisayarlayın. Aşağıdaki kod, olay işleyicisini DataBound tamamen gösterir:

Protected Sub ExpensiveProductsPriceInBoldItalic_DataBound _
    (sender As Object, e As System.EventArgs) _
    Handles ExpensiveProductsPriceInBoldItalic.DataBound

    Dim product As Northwind.ProductsRow = _
        CType(CType(ExpensiveProductsPriceInBoldItalic.DataItem, _
            System.Data.DataRowView).Row, Northwind.ProductsRow)
    If Not product.IsUnitPriceNull() AndAlso product.UnitPrice > 75 Then
       ExpensiveProductsPriceInBoldItalic.Rows(4).Cells(1).CssClass = _
            "ExpensivePriceEmphasis"
    End If
End Sub

Maliyeti 75,00 TL'den az olan Chai'yi görüntülerken, fiyat normal bir yazı tipinde görüntülenir (bkz. Şekil 4). Ancak, fiyatı 97,00 ABD doları olan Mishi Kobe Niku'yu görüntülerken, fiyat kalın, italik bir yazı tipiyle görüntülenir (bkz. Şekil 5).

75,00 TL'den Küçük Fiyatlar Normal Yazı Tipinde Görüntülenir

Şekil 4: 75,00 TL'den Küçük Fiyatlar Normal Yazı Tipinde Görüntülenir (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Pahalı Ürünlerin Fiyatları Kalın, İtalik Yazı Tipinde Görüntülenir

Şekil 5: Pahalı Ürünlerin Fiyatları Kalın, İtalik Yazı Tipinde Görüntülenir (Tam boyutlu görüntüyü görüntülemek için tıklayın)

FormView DenetimininDataBoundOlay İşleyicisini Kullanma

Bir FormView'a bağlı temel alınan verileri belirleme adımları, DetailsView olay işleyicisi oluşturma DataBound , özelliği denetime bağlı uygun nesne türüne atama DataItem ve nasıl devam edileceğini belirleme adımlarıyla aynıdır. Ancak FormView ve DetailsView, kullanıcı arabiriminin görünümünün nasıl güncelleştirildiğinden farklıdır.

FormView herhangi bir BoundField içermez ve bu nedenle koleksiyonu içermez Rows . Bunun yerine, FormView statik HTML, Web denetimleri ve veri bağlama söz diziminin bir karışımını içerebilen şablonlardan oluşur. FormView stilini ayarlamak genellikle FormView şablonlarındaki bir veya daha fazla Web denetiminin stilini ayarlamayı içerir.

Bunu göstermek için, önceki örnekteki gibi ürünleri listelemek için bir FormView kullanalım, ancak bu kez yalnızca ürün adını ve stoktaki birimleri 10'dan küçük veya 10'a eşitse, stoktaki birimler kırmızı yazı tipinde görüntülenecek şekilde görüntüleyelim.

4. Adım: Ürün Bilgilerini FormView'da Görüntüleme

DetailsView öğesinin CustomColors.aspx altındaki sayfaya bir FormView ekleyin ve özelliğini olarak LowStockedProductsInRedayarlayınID. FormView'ı önceki adımda oluşturulan ObjectDataSource denetimine bağlayın. Bu, FormView için bir ItemTemplate, EditItemTemplateve InsertItemTemplate oluşturur. ve öğesini EditItemTemplate kaldırın ve her birinin kendi uygun adlandırılmış Etiket denetimlerinde yalnızca ProductName ve UnitsInStock değerlerini içermesini basitleştirinItemTemplate.InsertItemTemplate Önceki örnekteki DetailsView'da olduğu gibi, FormView'un akıllı etiketindeki Sayfalama etkinleştir onay kutusunu da işaretleyin.

Bu düzenlemelerden sonra FormView'unuzun işaretlemesi aşağıdakine benzer görünmelidir:

<asp:FormView ID="LowStockedProductsInRed" runat="server"
    DataKeyNames="ProductID" DataSourceID="ObjectDataSource1"
    AllowPaging="True" EnableViewState="False">
    <ItemTemplate>
        <b>Product:</b>
        <asp:Label ID="ProductNameLabel" runat="server"
         Text='<%# Bind("ProductName") %>'>
        </asp:Label><br />
        <b>Units In Stock:</b>
        <asp:Label ID="UnitsInStockLabel" runat="server"
          Text='<%# Bind("UnitsInStock") %>'>
        </asp:Label>
    </ItemTemplate>
</asp:FormView>

şunlara dikkat ItemTemplate edin:

  • Ve öğeleriyle birlikte "Product:" ve "Units In Stock:" metinlerini statik HTML olarak ayarlayın <br /><b>.
  • Web , ProductNameLabelUnitsInStockLabelve etiket denetimlerini denetler.
  • Bu alanlardaki <%# Bind("ProductName") %> değerleri Etiket denetimlerinin Text özelliklerine atayan ve <%# Bind("UnitsInStock") %> söz diziminin veri bağlama söz dizimi.

5. Adım: DataBound Olay İşleyicisindeki Verilerin Değerini Program Aracılığıyla Belirleme

FormView'un işaretlemesi tamamlandıktan sonra, bir sonraki adım değerin UnitsInStock 10'dan küçük veya 10'a eşit olup olmadığını program aracılığıyla belirlemektir. Bu, DetailsView ile olduğu gibi FormView ile tam olarak aynı şekilde gerçekleştirilir. FormView'un DataBound olayı için bir olay işleyicisi oluşturarak başlayın.

DataBound Olay İşleyicisi Oluşturma

Şekil 6: Olay İşleyicisi DataBound Oluşturma

Olay işleyicisinde FormView özelliğini DataItem bir ProductsRow örneğe yayınlar ve değerin UnitsInPrice kırmızı yazı tipinde görüntülememiz gereken bir değer olup olmadığını belirler.

Protected Sub LowStockedProductsInRed_DataBound _
    (sender As Object, e As System.EventArgs) _
    Handles LowStockedProductsInRed.DataBound

    Dim product As Northwind.ProductsRow = _
        CType(CType(LowStockedProductsInRed.DataItem, System.Data.DataRowView).Row, _
            Northwind.ProductsRow)
    If Not product.IsUnitsInStockNull() AndAlso product.UnitsInStock <= 10 Then
        Dim unitsInStock As Label = _
            CType(LowStockedProductsInRed.FindControl("UnitsInStockLabel"), Label)

        If unitsInStock IsNot Nothing Then
        End If
    End If
End Sub

6. Adım: FormView'un ItemTemplate Öğesinde UnitsInStockLabel Etiket Denetimini Biçimlendirme

Son adım, değer 10 veya daha küçükse görüntülenen UnitsInStock değeri kırmızı yazı tipinde biçimlendirmektir. Bunu başarmak için içindeki ItemTemplate denetime program aracılığıyla erişmemiz UnitsInStockLabel ve metinlerinin kırmızı olarak görüntülenmesi için stil özelliklerini ayarlamamız gerekir. Şablondaki bir Web denetimine erişmek için yöntemini şu şekilde kullanın FindControl("controlID") :

Dim someName As WebControlType = _
    CType(FormViewID.FindControl("controlID"), WebControlType)

Örneğimizde değeri UnitsInStockLabelolan ID bir Etiket denetimine erişmek istiyoruz, bu nedenle şunu kullanacağız:

Dim unitsInStock As Label = _
    CType(LowStockedProductsInRed.FindControl("UnitsInStockLabel"), Label)

Web denetimine programlı bir başvuru elde ettikten sonra, stille ilgili özelliklerini gerektiği gibi değiştirebiliriz. Önceki örnekte olduğu gibi adlı içinde Styles.cssLowUnitsInStockEmphasisbir CSS sınıfı oluşturdum. Bu stili Label Web denetimine uygulamak için özelliğini uygun şekilde ayarlayın CssClass .

Protected Sub LowStockedProductsInRed_DataBound _
    (sender As Object, e As System.EventArgs) _
    Handles LowStockedProductsInRed.DataBound

    Dim product As Northwind.ProductsRow = _
        CType(CType(LowStockedProductsInRed.DataItem, System.Data.DataRowView).Row, _
            Northwind.ProductsRow)
    If Not product.IsUnitsInStockNull() AndAlso product.UnitsInStock <= 10 Then
        Dim unitsInStock As Label = _
            CType(LowStockedProductsInRed.FindControl("UnitsInStockLabel"), Label)

        If unitsInStock IsNot Nothing Then
            unitsInStock.CssClass = "LowUnitsInStockEmphasis"
        End If
    End If
End Sub

Not

Şablonu kullanarak program aracılığıyla Web denetimine FindControl("controlID") erişmek ve stille ilgili özelliklerini ayarlamak için kullanılan söz dizimi, DetailsView veya GridView denetimlerinde TemplateFields kullanılırken de kullanılabilir. Sonraki öğreticimizde TemplateFields'i inceleyeceğiz.

Şekil 7'de değeri 10'dan büyük olan bir ürün UnitsInStock görüntülenirken FormView gösterilirken, Şekil 8'deki ürünün değeri 10'dan küçüktür.

Stokta Yeterince Büyük Birimlere Sahip Ürünler için Özel Biçimlendirme Uygulanmaz

Şekil 7: Stokta Yeterince Büyük Birimleri Olan Ürünler için Özel Biçimlendirme Uygulanmaz (Tam boyutlu görüntüyü görüntülemek için tıklayın)

10 veya Daha Az Değerli Ürünler için Stok Numarasındaki Birimler KırmızıYla Gösterilir

Şekil 8: Stok Numarasındaki Birimler, 10 veya Daha Az Değerli Ürünler için Kırmızı Renkte Gösterilir (Tam boyutlu görüntüyü görüntülemek için tıklayın)

GridView'ınRowDataBoundOlayıyla Biçimlendirme

Daha önce DetailsView ve FormView denetimlerinin veri bağlama sırasında ilerletilen adım dizisini inceledik. Şimdi bu adımları bir kez daha yenileyici olarak inceleyelim.

  1. Veri Web denetiminin DataBinding olayı tetikler.
  2. Veriler, veri Web denetimine bağlıdır.
  3. Veri Web denetiminin DataBound olayı tetikler.

Bu üç basit adım, yalnızca tek bir kayıt görüntülediklerinden DetailsView ve FormView için yeterlidir. Buna bağlı tüm kayıtları görüntüleyen GridView için (yalnızca ilk kayıt değil), 2. adım biraz daha önemlidir.

2. adımda GridView veri kaynağını numaralandırır ve her kayıt için bir GridViewRow örnek oluşturur ve geçerli kaydı buna bağlar. GridView'a eklenen her GridViewRow bir olay için iki olay oluşturulur:

  • RowCreated oluşturulduktan sonra GridViewRow tetikler
  • RowDataBound geçerli kayıt öğesine bağlandıktan sonra tetikler GridViewRow.

GridView için veri bağlama aşağıdaki adım dizisiyle daha doğru şekilde açıklanmıştır:

  1. GridView'un DataBinding olayı tetikler.

  2. Veriler GridView'a bağlıdır.

    Veri kaynağındaki her kayıt için

    1. GridViewRow Nesne oluşturma
    2. Olayı tetikle RowCreated
    3. Kaydı GridViewRow
    4. Olayı tetikle RowDataBound
    5. GridViewRow koleksiyonuna Rows ekleme
  3. GridView'un DataBound olayı tetikler.

GridView'un tek tek kayıtlarının biçimini özelleştirmek için olay için bir olay işleyicisi RowDataBound oluşturmamız gerekir. Bunu göstermek için sayfaya CustomColors.aspx her ürünün adını, kategorisini ve fiyatını listeleyen ve fiyatı 10,00 TL'den düşük olan ürünleri sarı arka plan rengiyle vurgulayan bir GridView ekleyelim.

7. Adım: GridView'da Ürün Bilgilerini Görüntüleme

Önceki örnekten FormView altına bir GridView ekleyin ve özelliğini olarak HighlightCheapProductsayarlayınID. Sayfadaki tüm ürünleri döndüren bir ObjectDataSource'larımız olduğundan GridView'u buna bağlayın. Son olarak GridView'un BoundField değerlerini yalnızca ürünlerin adlarını, kategorilerini ve fiyatlarını içerecek şekilde düzenleyin. Bu düzenlemeler tamamlandıktan sonra GridView'un işaretlemesi şöyle görünmelidir:

<asp:GridView ID="HighlightCheapProducts" AutoGenerateColumns="False"
    DataKeyNames="ProductID" DataSourceID="ObjectDataSource1"
    EnableViewState="False" runat="server">
    <Columns>
        <asp:BoundField DataField="ProductName" HeaderText="Product"
          SortExpression="ProductName" />
        <asp:BoundField DataField="CategoryName" HeaderText="Category"
          ReadOnly="True" SortExpression="CategoryName" />
        <asp:BoundField DataField="UnitPrice" DataFormatString="{0:c}"
          HeaderText="Price"
            HtmlEncode="False" SortExpression="UnitPrice" />
    </Columns>
</asp:GridView>

Şekil 9'da tarayıcı üzerinden görüntülendiğinde bu noktaya ilerleme durumumuz gösterilmektedir.

GridView, Her Ürünün Adını, Kategorisini ve Fiyatını Listeler

Şekil 9: GridView, Her Ürün için Ad, Kategori ve Fiyat Listeler (tam boyutlu görüntüyü görüntülemek için tıklayın)

8. Adım: RowDataBound Olay İşleyicisindeki Verilerin Değerini Program Aracılığıyla Belirleme

GridView'a ProductsDataTableProductsRow bağlı olduğunda örnekleri numaralandırılır ve her ProductsRow biri için bir GridViewRow oluşturulur. 'GridViewRownin DataItem özelliği, GridView'un RowDataBound olay işleyicisi tetiklendiği belirli ProductRowöğesine atanır. GridView'a bağlı her ürünün değerini belirlemek UnitPrice için GridView'un RowDataBound olayı için bir olay işleyicisi oluşturmamız gerekir. Bu olay işleyicisinde geçerli GridViewRow değeri UnitPrice inceleyebilir ve bu satır için biçimlendirme kararı verebiliriz.

Bu olay işleyicisi, FormView ve DetailsView ile aynı adım serisi kullanılarak oluşturulabilir.

GridView'un RowDataBound Olayı için Olay İşleyicisi Oluşturma

Şekil 10: GridView RowDataBound Olayı için Olay İşleyicisi Oluşturma

Olay işleyicisinin bu şekilde oluşturulması, aşağıdaki kodun ASP.NET sayfasının kod bölümüne otomatik olarak eklenmesine neden olur:

Protected Sub HighlightCheapProducts_RowDataBound _
    (sender As Object, e As System.Web.UI.WebControls.GridViewRowEventArgs) _
    Handles HighlightCheapProducts.RowDataBound

End Sub

RowDataBound Olay tetiklendiğinde, olay işleyicisi ikinci parametresi olarak adlı Rowbir özelliği olan türünde GridViewRowEventArgsbir nesnesi olarak geçirilir. Bu özellik yalnızca veriye bağlı olan öğesine GridViewRow bir başvuru döndürür. ile ilişkili örneğe erişmek ProductsRow için GridViewRow özelliğini şu şekilde kullanırız DataItem :

Protected Sub HighlightCheapProducts_RowDataBound _
    (sender As Object, e As System.Web.UI.WebControls.GridViewRowEventArgs) _
    Handles HighlightCheapProducts.RowDataBound

    Dim product As Northwind.ProductsRow = _
        CType(CType(e.Row.DataItem, System.Data.DataRowView).Row, Northwind.ProductsRow)
    If Not product.IsUnitPriceNull() AndAlso product.UnitPrice < 10 Then
    End If
End Sub

Olay işleyicisi ile RowDataBound çalışırken GridView'un farklı satır türlerinden oluştuğunu ve bu olayın tüm satır türleri için tetiklendiğini unutmayın. Bir GridViewRow'nin türü özelliği tarafından RowType belirlenebilir ve olası değerlerden birine sahip olabilir:

  • DataRow GridView'un kaydına bağlı bir satır DataSource
  • EmptyDataRow GridView's DataSource boşsa görüntülenen satır
  • Footer alt bilgi satırı; GridView'un ShowFooter özelliği olarak ayarlıysa gösterilir True
  • Header üst bilgi satırı; GridView'un ShowHeader özelliğinin (varsayılan) olarak ayarlı True olup olmadığını gösterir
  • Pager disk belleği uygulayan GridView'lar için disk belleği arabirimini görüntüleyen satır
  • Separator GridView için kullanılmaz, ancak DataList ve Repeater denetimlerinin özellikleri tarafından RowType kullanılır. Sonraki öğreticilerde ele alacağımız iki veri Web denetimi

EmptyDataRow, Header, Footerve Pager satırları bir DataSource kayıtla ilişkilendirili olmadığından, her zaman kendi DataItem özellikleri için değerine Nothing sahip olurlar. Bu nedenle, geçerli GridViewRow'nin DataItem özelliğiyle çalışmayı denemeden önce bir ile DataRowilgilendiğimizden emin olmamız gerekir. Bu, 'nin RowType özelliğinin GridViewRowşöyle denetlenmesiyle gerçekleştirilebilir:

Protected Sub HighlightCheapProducts_RowDataBound _
    (sender As Object, e As System.Web.UI.WebControls.GridViewRowEventArgs) _
    Handles HighlightCheapProducts.RowDataBound

    If e.Row.RowType = DataControlRowType.DataRow Then
        Dim product As Northwind.ProductsRow = _
            CType(CType(e.Row.DataItem, System.Data.DataRowView).Row, Northwind.ProductsRow)
        If Not product.IsUnitPriceNull() AndAlso product.UnitPrice < 10 Then
        End If
    End If
End Sub

9. Adım: UnitPrice Değeri 10,00 TL'den Küçük olduğunda Satır Sarısını Vurgulama

Son adım, söz konusu satırın değeri 10,00 TL'den küçükse UnitPrice tüm GridViewRow değeri program aracılığıyla vurgulamaktır. GridView'un satırlarına veya hücrelerine erişme söz dizimi, belirli bir hücreye erişmek için satırın GridViewID.Rows(index).Cells(index) tamamına erişmek için DetailsView GridViewID.Rows(index) ile aynıdır. Ancak, olay işleyicisi veri bağlamayı GridViewRow tetiklediğinde RowDataBound GridView'ın Rows koleksiyonuna henüz eklenmemiştir. Bu nedenle, Rows koleksiyonunu kullanarak olay işleyicisinden RowDataBound geçerli GridViewRow örneğe erişemezsiniz.

GridViewID.Rows(index)yerine, kullanarak e.Rowolay işleyicisindeki RowDataBound geçerli GridViewRow örneğe başvurabiliriz. Yani, olay işleyicisinden RowDataBound geçerli GridViewRow örneği vurgulamak için şunu kullanırız:

e.Row.BackColor = System.Drawing.Color.Yellow

's BackColor özelliğini doğrudan ayarlamak GridViewRowyerine CSS sınıflarını kullanmaya devam edelim. Arka plan rengini sarı olarak ayarlayan adlı AffordablePriceEmphasis bir CSS sınıfı oluşturdum. Tamamlanan RowDataBound olay işleyicisi aşağıdaki gibidir:

Protected Sub HighlightCheapProducts_RowDataBound _
    (sender As Object, e As System.Web.UI.WebControls.GridViewRowEventArgs) _
    Handles HighlightCheapProducts.RowDataBound

    If e.Row.RowType = DataControlRowType.DataRow Then
        Dim product As Northwind.ProductsRow = _
            CType(CType(e.Row.DataItem, System.Data.DataRowView).Row, Northwind.ProductsRow)
        If Not product.IsUnitPriceNull() AndAlso product.UnitPrice < 10 Then
            e.Row.CssClass = "AffordablePriceEmphasis"
        End If
    End If
End Sub

En Uygun Fiyatlı Ürünler Sarı Vurgulanmış

Şekil 11: En Uygun Fiyatlı Ürünler Sarı Vurgulanmış (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Özet

Bu öğreticide GridView, DetailsView ve FormView'u denetime bağlı verilere göre biçimlendirmeyi gördük. Bunu başarmak için, temel alınan verilerin ve gerekirse biçimlendirme değişikliğinin incelendiği veya RowDataBound olayları için DataBound bir olay işleyicisi oluşturduk. DetailsView veya FormView'a bağlı verilere erişmek için, olay işleyicisinde özelliğini kullanırızDataItem; GridView için her GridViewRow örneğin DataItem özelliği, olay işleyicisinde RowDataBound bulunan bu satıra bağlı verileri içerir.DataBound

Veri Web denetiminin biçimlendirmesini program aracılığıyla ayarlama söz dizimi, Web denetimine ve biçimlendirilecek verilerin nasıl görüntülendiğine bağlıdır. DetailsView ve GridView denetimleri için satırlara ve hücrelere sıralı bir dizin tarafından erişilebilir. Şablonları kullanan FormView için yöntemi genellikle şablonun FindControl("controlID") içinden bir Web denetimi bulmak için kullanılır.

Sonraki öğreticide GridView ve DetailsView ile şablonların nasıl kullanılacağına bakacağız. Ayrıca, temel alınan verilere göre biçimlendirmeyi özelleştirmeye yönelik başka bir teknik de 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 E.R. Gilmore, Dennis Patterson ve Dan Jagers'dı. Yaklaşan MSDN makalelerimi gözden geçirmek istiyor musunuz? Öyleyse, bana adresinden bir satır mitchell@4GuysFromRolla.combırakın.