GridView ve DetailsView kullanarak kayıt düzenlemek Bir önceki yazımda teorik olarak bu iki kontrole ait eventlerden söz etmiştim. Şimdi uygulama yapma zamanı. Bunun için daha önceki yazılarımıza devam ediyoruz. Dolayısı ile aşağıdaki linkten ilgili uygulamayı indirip, bu yazı ile devam edebilirsiniz. Tabi birde Veritabanı yönetim sisteminizde Northwind veri tabanı olduğunu varsayıyoruz. http://www.ismailgursoy.com.tr/detailsview-kontrolune-stil-vermek/ Bu örneğimde DetailsView kontrolünde listelenmiş olan çalışan verilerini güncellemeyi göstereceğim. GridView ve DetailsView kontrollerinde editleme yapabilmemiz için her iki kontrolünde sahip olmuş olduğu CommandField özelliğini kullanırız. Şimdi uygulamıza başlayalım : Deafult.aspx sayfasını visual studio da design modda açalım. Altta yer alan DetailsView kontrolümüzü seçip saü üstünde yer alan oka tıklayarak Add New Field diyelim.
Daha sonra açılan pencerede, Choose a field type alanında dropdown menüsünden CommandField seçiniz. Altta yer alan checkbox kutularından Edit/Update Checkboxını seçiniz. Bu sırada Show cancel buton otomatik olarak seçili hale gelecektir, bırakın seçili kalsın. Bu işlemler tabii ki direkt olarak kod olarakda eklenerek yapılabilir. Eklenecek kod olan blok ya da bu işlemlerin sonucunda eklenen kodu paylaşayım : DetailsView kontrolünün Fields tagleri arasına aşağıdaki kod eklenmiştir. 1<asp:CommandField ShowEditButton="True" /> Artık DetailsView kontrolümün en altında veri listesinin altında bir adet Edit butonu yer alır. Projeyi çalıştırdığımızda bir çalışan seçiniz dediğimizde bunu görebiliriz.
Bu noktada eğer edit butonuna basarak hata alırız. Alacağımız hata; The DetailsView DetayBilgi fired event ModeChanging which wasn t handled. Bu hatayı almamız doğal çünkü bizim kontrolümüz edit butona basıldığında ne yapması gerektiğini henüz bilmiyor, yani kod yazmadık henüz. Şimdi Visual Studio da web formumuzun design görünümüne tekrar geçelim. Altta yer alan DetailsView kontrolümüzü seçelim. Sağ tarafta yer alan properties menüsünde yer alan yıldırım işaratine tıklayalım. Burada seçilen kontrole ait event listesini görebiliriz.
İlgili eventin yanında cif tıkladıktan sonra code behind tarafında visual studio bizim için ModeChanging eventini boş bir şekilde oluşturuyor. Bize ilgili kodları yazmak kalıyor. ModeChanging eventine aşağıdaki kodları ekliyoruz : protected void DetayBilgi_ModeChanging(object sender, 1 DetailsViewModeEventArgs e) 2 3 DetayBilgi.ChangeMode(e.NewMode); 4 DetayBilgiAl(); 5 Şimdi uygulamamızı çalıştırıp, bir çalışanı seçip seçiniz butonuna tıklayalım. Daha sonra DetailsView kontrolünde yer alan edit butonuna tıklayalım ve sonucu görelim.
Görüldüğü üzere artık textbox kontrollerim, update ve cancel butonum hali hazırda beni bekliyor Bunlara işlev kazandırmaya sonra geçicez tabi. Şimdi açıklama yapalım. Mode_Changing eventini anlayabilmek için DetailsView kontrolünün görüntüleme modlarını yani display mode larını bilmemiz gerekiyor. DetailsViewMode.ReadOnly : Bu mod varsayılan moddur. Veri göstermek için kullanılır. Uygulamamız çalıştırıldığında ve çalışan bilgileri detayı gösterildiğinde gördüğümüz durum DetailsView kontrolümüzün ReadOnly yani sadece okunabilir durumudur.
DetailsViewMode.Edit : Bu mod var olan bir veri kaydının editlenmesi için kullanılır. Bunu zaten gördük. DetailsViewMode.Insert : Bu mod yeni bir kayıt eklemek için kullanılır. Edit moduna çok benzer ama bu modda tüm kontroller boştur, çünkü yeni veri kaydedilecektir. ModeChanging eventine baktığımızda dikkat etmemiz gereken diğer bir husus; DetailsViewModeEventArgs sınıfının bir e parametresi almasıdır. e parametresinin NewMode özelliği ile kullanıcı tarafından talepte bulunulan display mode tanımlayabiliyoruz. Şu anda ayrıntıları görebiliyorum, edit ile düzenleme moduna geçebiliyorum, cancel ile düzenleme modundan çıkabiliyorum. Ancak Update butonum çalışmıyor. Çünkü henüz ilgili item için kodlarımı ve ne yapacağımı tanımlamadım. Bu da daha sonraki yazılarda yer alacak. Şimdi tüm kodlarımı ve ilgili uygulamayı aşağıda paylaşayım. Default.aspx : 1 2 3 4 5 6 7 8 9 10 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <link href="stylesheet.css" rel="stylesheet" type="text/css" /> <head runat="server"> <title></title> 11 12</head> 13 14 15 16 17 <body> <form id="form1" runat="server"> <div> <h1>veri Listesi</h1> <asp:gridview ID="GridView1" runat="server" 18 19 20 21d"> 22 23 24 25 26 27 AutoGenerateColumns="False" CssClass="GridMain" CellPadding="4" GridLines="None" onselectedindexchanged="gridview1_selectedindexchange Name" /> 28 29 <asp:boundfield DataField="FirstName" HeaderText = "First 30Name" /> 31 <asp:boundfield DataField="City" HeaderText = "City" /> 32 <asp:boundfield DataField="HomePhone" HeaderText="Home 33Phone" /> 34 35/> 36 37 38 <RowStyle CssClass="GridRow" /> <SelectedRowStyle CssClass="GridSelectedRow" /> <HeaderStyle CssClass="GridHeader" /> <Columns> <asp:boundfield DataField="LastName" HeaderText = "Last <asp:buttonfield CommandName="Select" Text="Seçiniz" </Columns> </asp:gridview> <br />
<asp:detailsview id="detaybilgi" runat="server" AutoGenerateRows="False" CellPadding="4" CssClass="GridMain" GridLines="None" onmodechanging="detaybilgi_modechanging"> <RowStyle CssClass="GridRow" /> <HeaderStyle CssClass="GridHeader" /> <Fields> <asp:boundfield DataField="Title" HeaderText="Title" /> <asp:boundfield DataField="TitleOfCourtesy" 39HeaderText="Title Of Courtesy" /> 40 <asp:boundfield DataField="BirthDate" HeaderText="Birth 41 Date" /> 42 <asp:boundfield DataField="HireDate" HeaderText="Hire 43 44 Date" /> 45 <asp:boundfield DataField="Address" HeaderText="Address" 46/> 47 <asp:boundfield DataField="Region" HeaderText="Region" /> 48 <asp:boundfield DataField="PostalCode" HeaderText="Postal 49Code" /> 50 <asp:boundfield DataField="Country" HeaderText="Country" 51/> 52 <asp:commandfield ShowEditButton="True" /> </Fields> <HeaderTemplate><%#Eval("FirstName")%> < %#Eval("LastName")%></HeaderTemplate> </asp:detailsview> </div> </form> </body> </strong></html> Default.aspx.cs : 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data.SqlClient; using System.Configuration; public partial class _Default : System.Web.UI.Page protected void Page_Load(object sender, EventArgs e) //Sayfam daha önce yüklenmedi ise veribagla metodumu çalıştırıyorum if (!IsPostBack) veribagla();
20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 //VeriBagla metodum private void veribagla() //SQL bağlantımı, komutumu ve datareader nesnemi tanımlıyorum. SqlConnection conn; SqlCommand comm; SqlDataReader reader; //Bağlantı satırımı ConfigurationManager sınıfı ile web config dosyasından atamış olduğum isimle çekiyorum. string connectionstring = ConfigurationManager.ConnectionStrings["Baglantim"].ConnectionSt ring; conn = new SqlConnection(connectionString); //SQL queryimi yazıyorum. Employees tablosundan çekmek istediğim verileri SELECT ile çekiyorum. comm = new SqlCommand("SELECT EmployeeID,LastName,FirstName,City,HomePhone FROM Employees", conn); try //Bağlantımı açıyorum, datareader nesnemi çalıştırıyorum ve GridView kontrolüme DataBind işlemi yapıyorum. conn.open(); reader = comm.executereader(); GridView1.DataSource = reader; GridView1.DataKeyNames = new string[] "EmployeeID" ; GridView1.DataBind(); //Reader nesnemi kapatıyorum reader.close(); //hata olursa vereceğim mesaj catch Response.Write("Bir hata oluştu"); //Bağlantımı kapatıyorum finally conn.close(); protected void GridView1_SelectedIndexChanged(object sender, EventArgs e) //DetayBilgiAl adında bir metot tanımlayacağım bu metot GridView kontrolümün SelectedIndexChanged eventinde çalışacak. DetayBilgiAl(); //DetayBilgiAl metodum