DropDownList Denetimi ve GridView ile Ana/Ayrıntı Filtreleme (C#)

tarafından Scott Mitchell

PDF’yi İndir

Bu öğreticide, ana kayıtların DropDownList denetiminde nasıl görüntüleneceğini ve gridview'da seçili liste öğesinin ayrıntılarını göreceğiz.

Giriş

Genel bir rapor türü, raporun bazı "ana" kayıtlar kümesi göstererek başladığı ana /ayrıntı raporudur. Kullanıcı daha sonra ana kayıtlardan birinde detaya gidebilir ve bu ana kaydın "ayrıntılarını" görüntüleyebilir. Ana/ayrıntı raporları, tüm kategorileri gösteren bir rapor gibi bire çok ilişkileri görselleştirmek ve ardından kullanıcının belirli bir kategoriyi seçip ilişkili ürünlerini görüntülemesini sağlamak için ideal bir seçimdir. Ayrıca, ana/ayrıntı raporları özellikle "geniş" tablolardan (çok fazla sütunu olan) ayrıntılı bilgileri görüntülemek için kullanışlıdır. Örneğin, bir ana/ayrıntı raporunun "ana" düzeyi, veritabanındaki ürünlerin yalnızca ürün adını ve birim fiyatını gösterebilir ve belirli bir üründe detaya gitme işlemi ek ürün alanlarını (kategori, tedarikçi, birim başına miktar vb.) gösterebilir.

Ana/ayrıntı raporunun uygulanabileceği birçok yol vardır. Bu ve sonraki üç öğreticide çeşitli ana/ayrıntı raporlarına göz atacağız. Bu öğreticide, ana kayıtların DropDownList denetiminde nasıl görüntüleneceğini ve gridview'da seçili liste öğesinin ayrıntılarını göreceğiz. Özellikle, bu öğreticinin ana/ayrıntı raporu kategori ve ürün bilgilerini listeler.

1. Adım: Bir DropDownList'te Kategorileri Görüntüleme

Ana/ayrıntı raporumuz, bir DropDownList'teki kategorileri listeler ve seçilen liste öğesinin ürünleri bir GridView'daki sayfada daha aşağıda görüntülenir. Önümüzdeki ilk görev, kategorilerin DropDownList içinde görüntülenmesidir. Klasördeki Filtering sayfayı FilterByDropDownList.aspx açın, Araç Kutusu'ndan bir DropDownList'e sürükleyip sayfanın tasarımcısına sürükleyin ve özelliğini olarak CategoriesayarlayınID. Ardından DropDownList'in akıllı etiketinden Veri Kaynağı Seç bağlantısına tıklayın. Bu, Veri Kaynağı Yapılandırma sihirbazını görüntüler.

Şekil 1: DropDownList'in Veri Kaynağını Belirtme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Sınıfın GetCategories() yöntemini çağıran CategoriesBLL adlı CategoriesDataSource yeni bir ObjectDataSource eklemeyi seçin.

Şekil 2: Adlı CategoriesDataSource Yeni Bir ObjectDataSource Ekleme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Şekil 3: Sınıfı Kullanmayı CategoriesBLL Seçin (Tam boyutlu görüntüyü görüntülemek için tıklayın)

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

ObjectDataSource'ı yapılandırdıktan sonra DropDownList'te hangi veri kaynağı alanının görüntüleneceğini ve liste öğesinin değeri olarak hangisinin ilişkilendirileceğini belirtmemiz gerekir. CategoryName Alanın görüntü olarak ve CategoryID her liste öğesi için değer olarak olmasını sağlayın.

Şekil 5: DropDownList'in Alanı Görüntülemesini CategoryName ve Değer Olarak Kullanmasını CategoryID Sağlayın (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Bu noktada, tablodaki kayıtlarla Categories doldurulmuş bir DropDownList denetimimiz vardır (bunların tümü yaklaşık altı saniye içinde gerçekleştirilir). Şekil 6'da tarayıcı üzerinden görüntülendiğinde ilerleme durumumuz gösterilmektedir.

Şekil 6: Geçerli Kategorileri Drop-Down Listeler (Tam boyutlu görüntüyü görüntülemek için tıklayın)

2. Adım: Products GridView'ı ekleme

Ana/ayrıntı raporumuzdaki son adım, seçilen kategoriyle ilişkili ürünleri listelemektir. Bunu yapmak için sayfaya bir GridView ekleyin ve adlı productsDataSourceyeni bir ObjectDataSource oluşturun. Denetimin sınıfın productsDataSource yönteminden verilerini kaldırmasını ProductsBLLGetProductsByCategoryID(categoryID) sağlayın.

Şekil 7: Yöntemi seçin GetProductsByCategoryID(categoryID) (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Bu yöntemi seçtikten sonra ObjectDataSource sihirbazı yöntemin categoryID parametresinin değerini ister. Seçili categories DropDownList öğesinin değerini kullanmak için Parametre kaynağını Control ve ControlID değerini olarak Categoriesayarlayın.

Şekil 8: Parametreyi categoryID DropDownList Değeri Categories olarak ayarlayın (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Tarayıcıda ilerleme durumumuzu gözden geçirin. Sayfayı ilk kez ziyaret ettiğinizde, seçilen kategoriye (İçecekler) ait olan ürünler görüntülenir (Şekil 9'da gösterildiği gibi), ancak DropDownList'in değiştirilmesi verileri güncelleştirmez. Bunun nedeni GridView'un güncelleştirilebilmesi için bir geri göndermenin gerçekleşmesi gerekir. Bunu başarmak için iki seçeneğimiz vardır (bunların hiçbiri kod yazmayı gerektirmez):

• DropDownList'inAutoPostBack özelliğiniTrue olarak ayarlayın. (DropDownList'in akıllı etiketinde AutoPostBack'i Etkinleştir seçeneğini işaretleyerek bunu gerçekleştirebilirsiniz.) Bu, DropDownList'in seçili öğesi kullanıcı tarafından her değiştirildiğinde geri göndermeyi tetikler. Bu nedenle, kullanıcı DropDownList'ten yeni bir kategori seçtiğinde bir geri gönderme başlatılır ve GridView yeni seçilen kategoriye ait ürünlerle güncelleştirilir. (Bu öğreticide kullandığım yaklaşım budur.)
• DropDownList öğesinin yanına bir Button Web denetimi ekleyin. Özelliğini Text Refresh veya benzeri bir değer olarak ayarlayın. Bu yaklaşımla, kullanıcının yeni bir kategori seçmesi ve ardından Düğme'ye tıklaması gerekir. Düğmeye tıklanması geri göndermeye neden olur ve GridView'ı seçili kategorideki ürünleri listeleyecek şekilde güncelleştirir.

Şekil 9 ve 10'da ana/ayrıntı raporu iş başında gösterilir.

Şekil 9: Sayfayı İlk Ziyaret Ettiğinizde İçecek Ürünleri Görüntülenir (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Şekil 10: Yeni Ürün Seçme (Üretim) Otomatik Olarak Geri Göndermeye Neden Oluyor, GridView Güncelleştiriliyor (Tam boyutlu görüntüyü görüntülemek için tıklayın)

"-- Kategori Seçin --" Liste Öğesi Ekleme

Sayfayı FilterByDropDownList.aspx ilk kez ziyaret ettiğinizde DropDownList'in ilk liste öğesi (İçecekler) kategorileri varsayılan olarak seçilidir ve GridView'da içecek ürünleri gösterilir. İlk kategorinin ürünlerini göstermek yerine, "-- Kategori Seç --" gibi bir DropDownList öğesinin seçilmesini isteyebiliriz.

DropDownList'e yeni bir liste öğesi eklemek için Özellikler penceresi gidin ve özelliğindeki Items üç noktaya tıklayın. "-- Kategori Seçin --" ve Value-1ile Text yeni bir liste öğesi ekleyin.

Şekil 11: Ekleme -- Kategori Seç -- Liste Öğesi (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Alternatif olarak, DropDownList'e aşağıdaki işaretlemeyi ekleyerek liste öğesini ekleyebilirsiniz:

<asp:DropDownList ID="categories" runat="server"
    AutoPostBack="True" DataSourceID="categoriesDataSource"
    DataTextField="CategoryName" DataValueField="CategoryID"
    EnableViewState="False">
    <asp:ListItem Value="-1">
       -- Choose a Category --
    </asp:ListItem>
</asp:DropDownList>

Ayrıca, Kategoriler ObjectDataSource'tan DropDownList'e bağlı olduğunda Doğru değilse AppendDataBoundItems el ile eklenen liste öğelerinin üzerine yazacağından DropDownList denetimini AppendDataBoundItems True olarak ayarlamamız gerekir.

Şekil 12: Özelliği True olarak ayarlama AppendDataBoundItems

Bu değişikliklerden sonra sayfayı ilk ziyaret ettiğinizde "-- Kategori Seç --" seçeneği belirlenir ve hiçbir ürün görüntülenmez.

Şekil 13: İlk Sayfa Yüklemesinde Ürün Görüntülenmiyor (Tam boyutlu görüntüyü görüntülemek için tıklayın)

"-- Kategori Seçin --" liste öğesi seçildiğinde hiçbir ürünün görüntülenme olmasının nedeni değerinin olması -1 ve veritabanında öğesi olan hiçbir CategoryID-1ürün olmamasıdır. İstediğiniz davranış buysa, bu noktada işiniz bitti demektir! Bununla birlikte, "-- Kategori Seçin --" liste öğesi seçildiğinde tüm kategorileri görüntülemek istiyorsanız, sınıfına ProductsBLL dönün ve geçirilen categoryID parametre sıfırdan küçükse yöntemini çağıracak GetProducts() şekilde yöntemini özelleştirinGetProductsByCategoryID(categoryID):

public Northwind.ProductsDataTable GetProductsByCategoryID(int categoryID)
{
    if (categoryID < 0)
        return GetProducts();
    else
        return Adapter.GetProductsByCategoryID(categoryID);
}

Burada kullanılan teknik, Bildirim Temelli Parametreler öğreticisinde tüm sağlayıcıları geri görüntülemek için kullandığımız yaklaşıma benzer, ancak bu örnekte tüm kayıtların yerine nullalınması gerektiğini belirtmek için değerini -1 kullanıyoruz. Bunun nedeni yönteminin categoryID parametresinin GetProductsByCategoryID(categoryID) geçirilen tamsayı değeri olarak beklemesi, Bildirim Temelli Parametreler öğreticisinde ise dize giriş parametresini geçirmemizdir.

Şekil 14'de "-- Kategori Seç --" seçeneğinin FilterByDropDownList.aspx belirlendiğinde ekran görüntüsü gösterilir. Burada tüm ürünler varsayılan olarak görüntülenir ve kullanıcı belirli bir kategoriyi seçerek ekranı daraltabilir.

Şekil 14: Tüm Ürünler Artık Varsayılan Olarak Listeleniyor (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Özet

Hiyerarşik olarak ilgili verileri görüntülerken, genellikle verilerin ana/ayrıntı raporlarını kullanarak sunulmasına yardımcı olur. Bu raporlar, kullanıcının hiyerarşinin en üstünden verileri inceleyip ayrıntılara inmeye başlayabilmesini sağlar. Bu öğreticide, seçilen kategorinin ürünlerini gösteren basit bir ana/ayrıntı raporu oluşturmayı inceledik. Bu, kategori listesi için DropDownList ve seçilen kategoriye ait ürünler için GridView kullanılarak gerçekleştirilir.

Sonraki öğreticide iki DropDownList kullanarak DropDownList arabirimini bir adım daha ileri götü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 Saat içinde 2.0. Adresine adresinden veya adresinden ulaşabileceğiniz http://ScottOnWriting.NETblogu aracılığıyla ulaşabilirsinizmitchell@4GuysFromRolla.com.

Sonraki