Veysel Uğur KIZMAZ

Asp.Net MVC 3 & Entity Framework - Proje - Edit

16.06.2012Okunma Sayısı: 9908Kategori: ASP.NET MVC

Önceki makalelerimizde MVC 3 ve Entity Framework kullanarak bir projeye başlamış, verilerimizi listelemiş ve yeni kayıt oluşturma işlemini incelemiştik. Projemizde Yazar tablomuzdaki kayıtları almıştık. Şimdi bu tabloya aynı yöntemle kayıt ekleme işlemini gerçekleştirelim. 

Bir önceki makalemizdeki örneğimize kaldığımız yerden devam edeceğiz. Önceki makalemizden veri yapısını inceleyebilirsiniz.
 
Entity Framework ile Update işlemini gerçekleştirmemiş arkadaşlar, Entity Framework Insert makalesinden Entity Framework ile Update işlemini hatırlayabilirler.
 
Şimdi MVC 3 ile View’ımızdan verilerimizi alıp veritabanına kaydedelim.
 
Öncelikle MYazar modelimizde bir düzenleme yapmamız gerekecektir. Veritabanındaki türümüz Yazar, bizim View’lara gönderdiğimiz ve aldığımız veri türümüz MYazar’dır. Veritabanından gelen Yazar türündeki veriyi View’da MYazar türünden göstereceğimiz için MYazar sınıfımıza Yazar sınıfından verileri alacak bir method ekleyelim.
 
MYazar sınıfımızın son hali aşağıdaki gibidir.
 
MYazar.cs
 
  1. public class MYazar
  2. {
  3.     public int YazarId { get; set; }
  4.     public string YazarAd { get; set; }
  5.     public int MakaleSayisi { get; set; }
  6.     public Yazar ToYazar()
  7.     {
  8.         return new Yazar
  9.         {
  10.             YazarId = this.YazarId,
  11.             YazarAd = this.YazarAd,
  12.             MakaleSayisi = this.MakaleSayisi
  13.         };
  14.     }
  15.     public void ImportFromYazar(Yazar yazar)
  16.     {
  17.         this.YazarId = yazar.YazarId;
  18.         this.YazarAd = yazar.YazarAd;
  19.         this.MakaleSayisi = yazar.MakaleSayisi;
  20.     }
  21. }
 
 
Şimdi YazarController sınıfımıza gidip aşağıdaki methodu ekleyelim.
 
  1. public ActionResult Edit(int yazarId)
  2. {
  3.     var duzenleYazar = (from y in _entity.Yazar where y.YazarId == yazarId select y).FirstOrDefault();
  4.     var modelYazar = new MYazar();
  5.     modelYazar.ImportFromYazar(duzenleYazar);
  6.     return View(modelYazar);
  7. }
 
 
Burada, parametre olarak gelen yazarId’ye göre veritabanından o kaydın bilgisini alıp View’da gösterme işlemini gerçekleştireceğiz.
 
Methodumuzu oluşturduktan sonra Edit’e sağ tıklayıp Add View diyelim ve aşağıdaki seçimleri yapalım.
 
 
Add butonuna tıkladığımızda Edit View’ımız oluşacaktır ve kodu aşağıdaki gibi olacaktır.
 
 
  1. @model MVCMakale3.Models.MYazar
  2.  
  3. @{
  4.     ViewBag.Title = "Edit";
  5.     Layout = "~/Views/Shared/_Layout.cshtml";
  6. }
  7.  
  8. <h2>Edit</h2>
  9.  
  10. <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
  11. <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
  12.  
  13. @using (Html.BeginForm()) {
  14.     @Html.ValidationSummary(true)
  15.     <fieldset>
  16.         <legend>MYazar</legend>
  17.  
  18.         <div class="editor-label">
  19.             @Html.LabelFor(model => model.YazarId)
  20.         </div>
  21.         <div class="editor-field">
  22.             @Html.EditorFor(model => model.YazarId)
  23.             @Html.ValidationMessageFor(model => model.YazarId)
  24.         </div>
  25.  
  26.         <div class="editor-label">
  27.             @Html.LabelFor(model => model.YazarAd)
  28.         </div>
  29.         <div class="editor-field">
  30.             @Html.EditorFor(model => model.YazarAd)
  31.             @Html.ValidationMessageFor(model => model.YazarAd)
  32.         </div>
  33.  
  34.         <div class="editor-label">
  35.             @Html.LabelFor(model => model.MakaleSayisi)
  36.         </div>
  37.         <div class="editor-field">
  38.             @Html.EditorFor(model => model.MakaleSayisi)
  39.             @Html.ValidationMessageFor(model => model.MakaleSayisi)
  40.         </div>
  41.  
  42.         <p>
  43.             <input type="submit" value="Save" />
  44.         </p>
  45.     </fieldset>
  46. }
  47.  
  48. <div>
  49.     @Html.ActionLink("Back to List", "Index")
  50. </div>
Burada, YazarId’ye bu ekranda ihtiyaç olmadığı için burada YazarId textbox’ının görünmesini istemiyoruz. Bu sebeple kodumuzu aşağıdaki gibi düzenleyelim (metinleri de Türkçeleştirelim J )
 
 
  1. @model MVCMakale3.Models.MYazar
  2.  
  3. @{
  4.     ViewBag.Title = "Yazar Düzenle";
  5.     Layout = "~/Views/Shared/_Layout.cshtml";
  6. }
  7.  
  8. <h2>Edit</h2>
  9.  
  10. <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
  11. <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
  12.  
  13. @using (Html.BeginForm()) {
  14.     @Html.ValidationSummary(true)
  15.     <fieldset>
  16.         <legend>MYazar</legend>
  17.  
  18.         <div class="editor-label">
  19.             @Html.LabelFor(model => model.YazarId)
  20.         </div>
  21.  
  22.         <div class="editor-label">
  23.             @Html.LabelFor(model => model.YazarAd)
  24.         </div>
  25.         <div class="editor-field">
  26.             @Html.EditorFor(model => model.YazarAd)
  27.             @Html.ValidationMessageFor(model => model.YazarAd)
  28.         </div>
  29.  
  30.         <div class="editor-label">
  31.             @Html.LabelFor(model => model.MakaleSayisi)
  32.         </div>
  33.         <div class="editor-field">
  34.             @Html.EditorFor(model => model.MakaleSayisi)
  35.             @Html.ValidationMessageFor(model => model.MakaleSayisi)
  36.         </div>
  37.  
  38.         <p>
  39.             <input type="submit" value="Kaydet" />
  40.         </p>
  41.     </fieldset>
  42. }
  43.  
  44. <div>
  45.     @Html.ActionLink("Listeye Dön", "Index")
  46. </div>
 Şimdi projemizi çalıştıralım.
 
 
Edit butonuna tıklayalım.
 
 
Yukarıdaki hatayla karşılaştık. Burada, Edit Action methodumuza Int32 türünde bir ID göndermemiz gerektiğini ve gönderme işlemini yapmadığımızı söylüyor. Bunu düzenlemek için Index.cshtml koduna gidip orada Edit linkini verdiğimiz yerde (@Html.ActionLink() methodu) düzenleme yapalım.
 
Linkimizin eski hali:
 
  1. @Html.ActionLink("Edit", "Edit") |
Linkimizin yeni hali:
 
  1. @Html.ActionLink("Edit", "Edit", new {yazarId = item.YazarId }) |
Şimdi projemizi çalıştıralım.
 
 
Edit butonunun üzerine faremizle geldiğimizde yönleneceği link olarak /Yazar/Edit/1 olarak belirlendiğini görüyoruz. Bu, Index.cshtml’de yaptığımız değişiklik sayesinde ID’yi alıp Edit() actionına yazarId=1 ile göndermeyi sağlamaktadır.
 
Şimdi Edit butonuna tıklayalım ve karşımıza nasıl bir ekran gelecek görelim.
 
 
Karşımıza düzenleme ekranımız geldi. Kaydet butonuna bastığımızda sayfamızın yapacağı işlemle ilgili herhangi bir düzenleme yapmadık. Şimdi bu düzenlemeyi yapmak için YazarController’a gidelim ve Edit() isminde aşağıdaki gibi, sayfamızdaki verilerimizi gönderdiğimizde (Post) çalışacak YENİ methodumuzu oluşturalım.
 
 
  1. [HttpPost]
  2. public ActionResult Edit(MYazar yazar)
  3. {
  4.     var duzenleYazar = (from y in _entity.Yazar where y.YazarId == yazar.YazarId select y).FirstOrDefault();
  5.     duzenleYazar.YazarAd = yazar.YazarAd;
  6.     duzenleYazar.MakaleSayisi = yazar.MakaleSayisi;
  7.     _entity.SaveChanges();
  8.  
  9.     return View();
  10. }
Şimdi projemizi yeniden çalıştırıp ekrandaki bilgileri düzenleyelim ve Kaydet butonuna tıklayalım.
 
 
Makale sayısını 136 yapalım.
 
 
Kaydet butonuna basalım. Post işlemi tamamlandıktan sonra Listeye Dön’e tıklayalım ve düzenleme işlemimizin başarıyla tamamlanıp tamamlanmadığını inceleyelim.
 
 
Göründüğü gibi verimiz güncellenmiştir. İstersek Kaydet butonuna tıkladığımızda return View() yerine return RedirectToAction(“Index”) diyerek kayıt işlemi tamamlanınca “Index” viewına geçmesini sağlayabiliriz.
 
 
 
Veysel Uğur KIZMAZ
Bilgisayar Mühendisi
veysel@ugurkizmaz.com
www.ugurkizmaz.com