GridView Kontrolü - III - TemplateField Kullanımı ve Grid içinde Grid Kullanmak.

Bu makalemizde GridView kontrolü içinde template field alanlarin kullanimina deginecegiz.  Template field içerisinde istedigimiz HTML taglarini ve ASP.NET kontrollerini kullanabiliriz. Bu özellik isteklerimiz dogrultusunda grid satirlari olusturabilmemizi saglar. 

<asp:GridView ID="GridViewMusteri" runat="server">

    <Columns>

        <asp:TemplateField>

            <ItemTemplate>

            </ItemTemplate>

        </asp:TemplateField>

    </Columns>

</asp:GridView>

Yukarida da görüldügü gibi gridin satirlarini olusturacak kismi template field içerisindeki ItemTemplate içerisine koyuyoruz. Yapacagimiz örnek de Microsoft tarafindan ücretsiz olarak yayinlanan AdvantureWorkDW2008 veritabanini kullanacagiz. Isterseniz sizde bu eklentiyi indirip kendi veritabaniniza ekleyebilirsiniz. SQL

Bu örnek de Müsteri bilgilerini grid üzerinde gösterecegiz. Müsteri seçildigin de ise seçilen satirin hemen altinda müsterinin yapmis oldugu interne, FactInternetSales ve DimProduct alisverislerinden 10 tanesini gösterecegiz. Bunun için DimCustomert tablolarini kullanacagiz.  Ilk olarak Kod içerisinde Customer tablosundan bilgileri alip gride bind eden fonksiyonu yazalim. Sonrada gridimize template fieldleri ekleyelim.

protected void Page_Load(object sender, EventArgs e)

{

    if (!IsPostBack)

    {

        MusterileriGetir();

    }

}

SqlConnection connection = new SqlConnection("Data Source=.;Initial Catalog=AdventureWorksDW2008;Integrated Security=True");

private void MusterileriGetir()

{   

    connection.Open();

    SqlDataAdapter da = new SqlDataAdapter("SELECT TOP 500 CustomerKey,  FirstName, LastName, Gender, EmailAddress, AddressLine1 FROM DimCustomer", connection);

    DataTable dTable = new DataTable();

    da.SelectCommand.ExecuteNonQuery();

    da.Fill(dTable);

    GridViewMusteri.DataSource = dTable;

    GridViewMusteri.DataBind();

    connection.Close();

}

                Yukaridaki kodu ekledikten sonra gridi asagidaki gibi düzenleyin.

<asp:GridView ID="GridViewMusteri" AutoGenerateColumns="false" runat="server" OnRowCommand="GridViewMusteri_RowCommand">

    <Columns>

        <asp:TemplateField>

            <HeaderTemplate>

                <table width="100%">

                    <tr>

                        <th>

                            Isim

                        </th>

                        <th>

                            Soyad

                        </th>

                        <th>

                            Cinsiyet

                        </th>

                        <th>

                            E-Posta

                        </th>

                        <th>

                            Adres

                        </th>

<th>

    Göster

</th>

<th>

    Gizle

</th>                  

 </tr>

            </HeaderTemplate>

            <ItemTemplate>

                <tr style="font-size: 12px; font-weight: normal;" align="left">

                    <td>

                        <asp:Label ID="Label1" runat="server" Text='<%#Bind("FirstName") %>'></asp:Label>

                    </td>

                    <td>

                        <asp:Label ID="Label2" runat="server" Text='<%#Bind("LastName") %>'></asp:Label>

                    </td>

                    <td>

                        <asp:Label ID="Label3" runat="server" Text='<%#Bind("Gender") %>'></asp:Label>

                    </td>

                    <td>

                        <asp:Label ID="Label4" runat="server" Text='<%#Bind("EmailAddress") %>'></asp:Label>

                    </td>

                    <td>

                        <asp:Label ID="Label5" runat="server" Text='<%#Bind("AddressLine1") %>'></asp:Label>

                    </td>

                    <td>

                        <asp:LinkButton ID="LinkButton1" CommandName="Göster" CommandArgument='<%#Bind("CustomerKey") %>'

                            runat="server">Göster</asp:LinkButton>

                    </td>

<td>

                                <asp:LinkButton ID="LinkButton2" CommandName="Gizle" CommandArgument='<%#Bind("CustomerKey") %>'

                                    runat="server">Gizle</asp:LinkButton>

</td>

                </tr>

            </ItemTemplate>

            <FooterTemplate>

                </table>

            </FooterTemplate>

        </asp:TemplateField>

    </Columns>

</asp:GridView>

 Burada dikkat etmemiz gereken yerlerden birincisi Grid içerisinde AutoGenerateColumns="false" tagini eklemeniz aksi takdirde grid bind ettiginiz kaynakta bulunan kolonlari kendisi otomatik olarak üretir. Biz bu örnek de template filedlerle çalismak istedigimizden bunu false olarak ayarliyoruz. Ikinci önemli nokta template field içine ekledigimiz link buton için commandname ve commandargument taglarini ayarlamaniz. Ayrica grid üzerindeki satirlarda bir event oldugu zaman yani ekledigimiz link buton tiklandigi zaman çalisacak olan fonksiyonu ayarladik OnRowCommand = "GridViewMusteri_RowCommand" Bufonksiyonun içini nasil dolduracagimizi ilerleyen kisimlarda anlatacagim. Projeniz çalistirdiginiz zaman Müsteri tablosundaki ilk 500 kayit grid içerisinde görüntülenecektir.  

                Simdi sira geldi seç butonuna tiklandigi zaman müsterinin yapmis oldugu alisverislerden 10 tanesini göstermeye. Bunun için ilk olarak template field içinde bulunan tablomuza yeni bir satir ekleyecegiz bunun içine de yeni bir grid koyacagiz. Müsteri gridi üzerinde göster butonuna basildigi zaman seçilen müsterinin CustomerKey özelligi ile veri tabanindan sorgu yaparak bu müsterinin yapmis oldugu son 10 alisverisi yeni giridimize bind edecegiz ayrica Gizle butonuna basildiginda Müsterinin Siparis detayini gizleyecegiz. Gridimizin yeni halinin bulundugu aspx sayfasi ve yazmamiz gereken C# kodlari asagidaki gibidir.

<asp:GridView ID="GridViewMusteri" AutoGenerateColumns="false" runat="server" OnRowCommand="GridViewMusteri_RowCommand">

<Columns>

<asp:TemplateField>

    <HeaderTemplate>

        <table width="800px">

            <tr>

                <th>

                    Isim

                </th>

                <th>

                    Soyad

                </th>

                <th>

                    Cinsiyet

                </th>

                <th>

                    E-Posta

                </th>

                <th>

                    Adres

                </th>

                <th>

                    Göster

                </th>

                <th>

                    Gizle

                </th>

            </tr>

    </HeaderTemplate>

    <ItemTemplate>

        <tr style="font-size: 13px; font-weight: normal;" align="left">

            <td>

                <asp:Label ID="Label1" runat="server" Text='<%#Bind("FirstName") %>'></asp:Label>

            </td>

            <td>

                <asp:Label ID="Label2" runat="server" Text='<%#Bind("LastName") %>'></asp:Label>

            </td>

            <td>

                <asp:Label ID="Label3" runat="server" Text='<%#Bind("Gender") %>'></asp:Label>

            </td>

            <td>

                <asp:Label ID="Label4" runat="server" Text='<%#Bind("EmailAddress") %>'></asp:Label>

            </td>

            <td>

                <asp:Label ID="Label5" runat="server" Text='<%#Bind("AddressLine1") %>'></asp:Label>

            </td>

            <td>

                <asp:LinkButton ID="LinkButton1" CommandName="Göster" CommandArgument='<%#Bind("CustomerKey") %>'

                    runat="server">Göster</asp:LinkButton>

            </td>

Ders Sahibi;
Bilgisayar Dershanesi