Gridview veri kaynagindan gelen verilerin düzenli bir sekilde istemci ekraninda görüntülenmesini saglar.Asp.Net ten önce verilerin liste halinde görüntülenmesi için Table kullanirdik.Asp.Net 1.0 ve 1.1 ile gelistirdigimiz web uygulamalarimizda ise çok kullanisli bir veri kontrol nesnesi olan Datagrid’i kullanirdik.Datagrid ile birlikte çesitli veri kaynaklarindan çekilen veriler çok kolay bir sekilde listelenebiliyordu.Asp.Net 2.0 ile birlikte Datagrid yerini daha gelismis bir kontrol olan Gridview ‘a birakti.
Gridview kontrolünün öne çikan özelliklerini sayacak olursak;
-
Yeni datasource kontrollerini destekler.
-
Mobile ve diger uygulamalarla uyumlulugu çok fazladir.
-
Hiç kod yazmadan gridview üzerinde paging ve sorting islemleri yapabiliriz.
-
Hiç kod yazmadan delete ve update islemlerini yapabiliriz.
-
Sablonlar ile çalisma özelligi oldukça gelismis.
RowEditing,RowCancelingEdit,RowUpdating,ve RowDeleting eventlari tetiklenir.Bizim amacimiz bu eventlari code-behind tarafinda yakalamak olacak.Bu eventlari kullanacagimiz bir senaryo düsünerek uygulamamiza basliyalim.Projemizde ögrenci bilgilerinin tutuldugu basit bir Access veritabanimiz olsun.Bu veritabanina ait Table’imizi tasarliyalim.
ve asp.net sayfamiza bir adet gridview ekliyoruz, ardindan properties özellikler penceresinden, AutoGenerate Colums özelligini false yapiyoruz... Gridview kontrolümüzü biz özellestirecegiz...
id alani Kisi tablomuz için primary key oldugu için bu alani kayit güncelleme ve silme isleminde kullanacagiz. GridView kontrolünde kolonlardaki keyleri bulmak için DataKeyNames özelligini kullaniyoruz. Bu yüzden GridViewe DataKeyNames="id"özelligini ekliyoruz.
Gridview kontrolümüzün üzerinde gelip GridView taks kismindan Edit colums kismina tikliyoruz...
Fields penceremizden Available fields kismindan Gridview;mizw CommandField ve Template field ekliyoruz...
Fieldslarimizi ekledikten sonra okey tusuna basiyoruz ve gridview kontrolümüze gerekli islemleri yapmis oluyoruz... ve asagidaki gibi gerekli düzenlemeler yapiyorum...
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
DataKeyNames="id" AllowPaging="True" PageSize="3">
<Columns>
<asp:CommandField ShowEditButton="True" ButtonType="Button" CancelText="Vazgeç"
DeleteText="Sil" EditText="Düzenle" ShowDeleteButton="True" />
<asp:TemplateField>
<EditItemTemplate >
<table cellpadding="0" cellspacing="0" width="400px" >
<tr>
<td>
<asp:TextBox ID="TextBox1" runat="server">asp:TextBox>
td>
tr>
<tr>
<td>
<asp:TextBox ID="TextBox2" runat="server">asp:TextBox>
td>
tr>
<tr>
<td>
<asp:TextBox ID="TextBox3" runat="server">asp:TextBox>
td>
tr>
<tr>
<td>
<asp:TextBox ID="TextBox4" runat="server">asp:TextBox>
td>
tr>
table>
<asp:Label ID="id" runat="server" Text='<%# Eval("id") %>'>asp:Label>
EditItemTemplate>
<ItemTemplate >
<table cellpadding="0" cellspacing="0" class="style1">
<tr>
<td class="style2">
<asp:Label ID="Label1" runat="server" Font-Bold="True" Text="Adi">asp:Label>
td>
<td class="style3">
<asp:Label ID="Label5" runat="server" Font-Bold="True" Text=":">asp:Label>
td>
<td>
<asp:Label ID="adi" runat="server" Text='<%# Eval("adi") %>' Font-Bold="True">asp:Label>
td>
tr>
<tr>
<td class="style2">
<asp:Label ID="Label2" runat="server" Font-Bold="True" Text="Soyadi">asp:Label>
td>
<td class="style3">
<asp:Label ID="Label6" runat="server" Font-Bold="True" Text=":">asp:Label>
td>
<td>
<asp:Label ID="soyadi" runat="server" Text='<%# Eval("soyadi") %>' Font-Bold="True">asp:Label>
td>
tr>
<tr>
<td class="style2">
<asp:Label ID="Label3" runat="server" Font-Bold="True" Text="Bölümü">asp:Label>
td>
<td class="style3">
<asp:Label ID="Label7" runat="server" Font-Bold="True" Text=":">asp:Label>
td>
<td>
<asp:Label ID="bölümü" runat="server" Text='<%# Eval("bölüm") %>' Font-Bold="True">asp:Label>
td>
tr>
<tr>
<td class="style2">
<asp:Label ID="Label4" runat="server" Font-Bold="True" Text="Numarasi">asp:Label>
td>
<td class="style3">
<asp:Label ID="Label8" runat="server" Font-Bold="True" Text=":">asp:Label>
td>
<td>
<asp:Label ID="numarasi" runat="server" Text='<%# Eval("numarasi") %>' Font-Bold="True">asp:Label>
td>
tr>
<tr>
<td class="style2">
td>
<td class="style3">
td>
<td>
td>
tr>
table>
ItemTemplate>
asp:TemplateField>
Columns>
asp:GridView>
commandfield gerekli güncellestirm yapmak için gridviewmize eklenen buton görevini yapmaktadir... Buton adi vs. özellikleri degismek için CommandField Properties penceresinden yapabilirisniz... Edititem Template içerisine koydugumuz textbox kontrolleri ile update yapmak için veritabanina giris alacabilecegimiz kontroller anlamina gelmekte...
ilk önce gridview data kontrolümüzü doldurmak için gerekli olan metodu yazalim... ve page load olayinda bu metodu çagiralim... Kodlarimizda veri tabani ile ilgili siniflari kullanacagimiz için onlari import etmeyi unutmuyoruz.
Imports System
Imports System.Data
Imports System.Data.OleDb
Partial Class _Default
Inherits System.Web.UI.Page
Dim baglanti As New OleDbConnection("Provider=Microsoft.Jet.OleDb.4.0; Data Source=" + Server.MapPath("App_Data/ogrenci.mdb"))
Dim sorgu As New OleDbCommand
Dim adap As New OleDbDataAdapter
Dim tablo As New DataTable
Sub doldur()
'GridView Kontrolümüzü dolduruyoruz...
baglanti.Open()
sorgu = New OleDbCommand("Select * from ögrenci", baglanti)
adap.SelectCommand = sorgu
adap.Fill(tablo)
GridView1.DataSource = tablo
GridView1.DataBind()
baglanti.Close()
End Sub
Yukaridaki yaptigimiz islem ile veritabaninki bilgileri data kontrolümüze cekmis bulunuyoruz... ve geçelim delete silme islemine...
sil butonuna bastigimizda Gridview rowdeleting eventi tetiklenecektir ve isleyisin dogru çalisabilmesi için gerekli kodlari
Protected Sub GridView1_RowUpdating kod satirinda yazmamiz gerekiyor.
bunun için Properties gridview özellikler penceresinde iken olaylar (Events) simgesine tikliyoruz ve Action kismindan RowDeleting;e gelip çift tikliyoruz ve karsimiza kod satiri geliyor.
Protected Sub GridView1_RowDeleting(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewDeleteEventArgs) Handles GridView1.RowDeleting
' Gridview satirimizin index numarasini aliyoruz...
Dim id As Integer = Convert.ToInt32(GridView1.DataKeys(e.RowIndex).Values(0))
' labeldeki id degerini integer veri türündeki id degiskenine aktariyoruz...
'baglantimizi açiyoruz...
baglanti.Open()
'Sql sorgumuzu yaziyoruz...
sorgu = New OleDbCommand("Delete from ögrenci where id=" & id, baglanti)
'Sorgumuzu çalistiriyoruz...
sorgu.ExecuteNonQuery()
'Sorgumuzu dispose ediyoruz...
sorgu.Dispose()
' Baglantimizi kapatiyoruz...
baglanti.Close()
' GridView datamizi dolduruyoruz...
doldur()
End Sub
kodlarini yazdiktan sonra hiç bir sorun ile karsilasmadan silme islemi basari ile gerçeklesecektir.
Düzenle butonuna bastigimizda ile GridView1_RowEditing eventi tetiklenecekir.
Protected Sub GridView1_RowEditing(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewEditEventArgs) Handles GridView1.RowEditing
'RowEditing eventi ile Edit islemi yani seçilen satirdaki verileri düzenleme için satiri aktif hala getiriyoruz...
GridView1.EditIndex = e.NewEditIndex
GridView1.DataBind()
doldur()
End Sub
ve karsimiza yukarida edititem templateye ekledigimiz textboxlar karsimiza çikacaktir, güncelleme islemi için gerekli bilgileri o textboxlar aracliligi ile girecegiz ve Update butonuna bastigimizda GridView1_RowUpdating Eventi tetiklenecektir, onun içinde gerekli kodlarimizi asagida gibi kodluyoruz... veya Vazgeç(Cancel) butonuda GridView1_RowCancelingEdit eventini tetikleyecektir.
Protected Sub GridView1_RowUpdating(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewUpdateEventArgs) Handles GridView1.RowUpdating
' GridView kontrolunun satir index numarasini aliyoruz...
Dim index As Integer = e.RowIndex
' Edit Item template kontrolünde labele veritabanindan id numarasini cekiyoruz...
Dim Label1 As Label = DirectCast(GridView1.Rows(index).FindControl("id"), Label)
' Edit Item template kontrolünde bulunan textboxlara ulasiyoruz...
Dim Textbox1 As TextBox = DirectCast(GridView1.Rows(index).FindControl("Textbox1"), TextBox)
Dim Textbox2 As TextBox = DirectCast(GridView1.Rows(index).FindControl("Textbox2"), TextBox)
Dim Textbox3 As TextBox = DirectCast(GridView1.Rows(index).FindControl("Textbox3"), TextBox)
Dim Textbox4 As TextBox = DirectCast(GridView1.Rows(index).FindControl("Textbox4"), TextBox)
' Edit item template kontrolünde bulunan labeldeki id numarasini id degiskenine atiyoruz...
Dim id As Integer = Convert.ToInt32(Label1.Text)
' Update sorgu cümlemizi yazip güncellestirme islemini gerçeklestiriyoruz...
baglanti.Open()
sorgu = New OleDbCommand("Update ögrenci set adi=@adi,soyadi=@soyadi,bölüm=@bölüm,numarasi=@numarasi where id=" & id, baglanti)
sorgu.Parameters.AddWithValue("@adi", Textbox1.Text)
sorgu.Parameters.AddWithValue("@soyadi", Textbox2.Text)
sorgu.Parameters.AddWithValue("@bölüm", Textbox3.Text)
sorgu.Parameters.AddWithValue("@numarasi", Textbox4.Text)
sorgu.ExecuteNonQuery()
sorgu.Dispose()
baglanti.Close()
' Gridview kontrolümüzü tekrar dolduruyoruz...
doldur()
GridView1.EditIndex = -1
GridView1.DataBind()
End Sub
Vazgeç Butonu için gerekli kodlar...
Protected Sub GridView1_RowCancelingEdit(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewCancelEditEventArgs) Handles GridView1.RowCancelingEdit
'RowCancelingEdit eventi ile güncelleme isleminin iptalini yapiyoruz...
GridView1.EditIndex = -1
GridView1.DataBind()
doldur()
End Sub
ve çok kisa bir sürede güncellestirme islemi yapmis bulunmaktayiz...
Gridview Data kontrolümüzde sayfalama islemine gelince, oda çok basit bir sekilde yapilabilmektedir... Bunun için Gridview Properties penceremizden Pading kismindan AllowPading sayfalama islemini true hale getiriyoruz... Page size ise kaç satirdan sonra sayfalama islemine geçmesi için bize sormaktadir. Yani gridview kontrolüze 3 veri geldikten sonra diger veriler diger bir sayfada görünmesini saglayabiliriz.
AllowPading islemide GridView1_PageIndexChanging Eventini tetikler, eventlere gelip PageIndexChanging eventine çift tiklayip kod satir sayfasina gecebiliriz ve asagida kodlari yazariz.
Protected Sub GridView1_PageIndexChanging(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewPageEventArgs) Handles GridView1.PageIndexChanging
' Sayfalama islemin isleyebilmesi için PageIndexChaning eventinin tetiklenip, asagida kodlarin çalismasini sagliyoruz...
' Gridview page index, yeni indexe atiyoruz ve bind edip dolduruyoruz...
GridView1.PageIndex = e.NewPageIndex
GridView1.DataBind()
doldur()
End Sub
ve sonrasinda güncellestirme,silme ve sayfalama islemleri basari ile tamamlanmis olur. Bu islemlerin farkli yollarida bulunmakta, fakat bu yolu deneyerekten baslayabilirsiniz. Faydali olabilir;
GridView dan select butonuna bastiginizda size önceden belirttiginiz sütunun(row.cells(4)) degerlerini veren kod.
Protected Sub GridView1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles GridView1.SelectedIndexChanged
Dim row As GridViewRow = GridView1.SelectedRow
TextBox1.Text = row.Cells(4).Text
End Sub
GridView dan select butonuna bastiginizda size seçtiginiz satirin value degerini veren kod.
Protected Sub GridView1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles GridView1.SelectedIndexChanged
TextBox1.Text = GridView1.SelectedValue.ToString()
End Sub
GridView dan select butonuna bastiginizda size seçtiginiz satirin dataKey degerini (seçili satirin ID degeri) veren kod.
Protected Sub GridView1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles GridView1.SelectedIndexChanged
' Display the primary key value of the selected row.
TextBox1.Text = GridView1.SelectedDataKey.Value.ToString()
End Sub