Veysel Uğur KIZMAZ

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

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

 Bir önceki makalemizde MVC 3 ve Entity Framework kullanarak bir projeye başlamıştık. 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. Bir önceki makalemizden veri yapısını inceleyebilirsiniz.
 
Entity Framework ile Insert işlemini gerçekleştirmemiş arkadaşlar, Entity Framework Insert makalesinden Entity Framework ile Insert 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ına Yazar türünden veri yazmamız gerekeceği için MYazar’dan Yazar türüne dönüşüm yapan bir fonksiyon yazmamız gerekmektedir.
 
MYazar.cs
 
  1. public class MYazar
  2. {
  3.     public int YazarId { getset; }
  4.     public string YazarAd { getset; }
  5.     public int MakaleSayisi { getset; }
  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. }
 
Öncelikle YazarController’a gidelim ve buraya Create isminde 2 method ekleyelim.
 
 
  1. private MakaleEntities _entity = new MakaleEntities();
  2. public ActionResult Create()
  3. {
  4.     return View();
  5. }
  6.  
  7. [HttpPost]
  8. public ActionResult Create(MYazar yazar)
  9. {
  10.     var kayitYazar = yazar.ToYazar();
  11.     _entity.AddToYazar(kayitYazar);
  12.     _entity.SaveChanges();
  13.     return View();
  14. }
 
Ilk Create() methodumuz, açılan yeni kayıt girmek için açılacak olan Create() action’ını temsil etmektedir. İkinci Create(Yazar) methodu ise, View’da kaydedeceğimiz verileri yazdıktan sonra kayıt butonuna tıkladığımızda yapılacak işlemi belirlemektedir. Bunu [HttpPost] attribute’u ile belirliyoruz. Parametre olarak aldığı MYazar, View’da doldurulan verinin türünü belirtmektedir.
 
İlk Create() methoduna sağ tıklayıp Add View diyelim.
 
 
Açılan ekranda Model Class olarak MYazar’ı (oluşturduğumuz modeli) seçiyoruz ve template olarak Create template’ini seçiyoruz.
 
Yazar/Create.cshtml View’ı oluştu. Başlangıçtaki kodları aşağıdaki gibidir.
 
 
  1. @model MVCMakale3.Models.MYazar
  2.  
  3. @{
  4.     ViewBag.Title = "Create";
  5. }
  6.  
  7. <h2>Create</h2>
  8.  
  9. <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
  10. <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
  11.  
  12. @using (Html.BeginForm()) {
  13.     @Html.ValidationSummary(true)
  14.     <fieldset>
  15.         <legend>MYazar</legend>
  16.  
  17.         <div class="editor-label">
  18.             @Html.LabelFor(model => model.YazarId)
  19.         </div>
  20.         <div class="editor-field">
  21.             @Html.EditorFor(model => model.YazarId)
  22.             @Html.ValidationMessageFor(model => model.YazarId)
  23.         </div>
  24.  
  25.         <div class="editor-label">
  26.             @Html.LabelFor(model => model.YazarAd)
  27.         </div>
  28.         <div class="editor-field">
  29.             @Html.EditorFor(model => model.YazarAd)
  30.             @Html.ValidationMessageFor(model => model.YazarAd)
  31.         </div>
  32.  
  33.         <div class="editor-label">
  34.             @Html.LabelFor(model => model.MakaleSayisi)
  35.         </div>
  36.         <div class="editor-field">
  37.             @Html.EditorFor(model => model.MakaleSayisi)
  38.             @Html.ValidationMessageFor(model => model.MakaleSayisi)
  39.         </div>
  40.  
  41.         <p>
  42.             <input type="submit" value="Create" />
  43.         </p>
  44.     </fieldset>
  45. }
  46.  
  47. <div>
  48.     @Html.ActionLink("Back to List", "Index")
  49. </div>
 
 
Burada dikkat etmemiz gereken noktalar:
  1. @Html.BeginForm() : İşlem yapılacak formun başlandığını belirtir.
  2. @Html.ValidationSummary() : Validation kontrollerimiz varsa bu kontrolleri yapacağını belirtir.
  3. @Html.LabelFor() : Parametredeki property’nin Label’ını oluşturur.
  4. @Html.EditorFor() : Parametredeki property’nin Editorünü oluşturur. (TextBox)
  5. @Html.ValidationMessageFor() : Parametredeki property’nin validation’ı varsa kontrolünü yaptıktan sonra uyarı mesajını oluşturur.
  6. @Html.ActionLink() : Sayfa yönlendirmesi için bir link oluşturur.
 
Sayfamızı şu şekilde düzenleyelim:
 
 
  1. @model MVCMakale3.Models.MYazar
  2.  
  3. @{
  4.     ViewBag.Title = "Yeni Yazar Kaydı";
  5. }
  6.  
  7. <h2>Create</h2>
  8.  
  9. <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
  10. <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
  11.  
  12. @using (Html.BeginForm()) {
  13.     @Html.ValidationSummary(true)
  14.     <fieldset>
  15.         <legend>Yeni Yazar Kaydı</legend>
  16.  
  17.         <div class="editor-label">
  18.             @Html.LabelFor(model => model.YazarAd)
  19.         </div>
  20.         <div class="editor-field">
  21.             @Html.EditorFor(model => model.YazarAd)
  22.             @Html.ValidationMessageFor(model => model.YazarAd)
  23.         </div>
  24.  
  25.         <div class="editor-label">
  26.             @Html.LabelFor(model => model.MakaleSayisi)
  27.         </div>
  28.         <div class="editor-field">
  29.             @Html.EditorFor(model => model.MakaleSayisi)
  30.             @Html.ValidationMessageFor(model => model.MakaleSayisi)
  31.         </div>
  32.  
  33.         <p>
  34.             <input type="submit" value="Oluştur" />
  35.         </p>
  36.     </fieldset>
  37. }
  38.  
  39. <div>
  40.     @Html.ActionLink("Listeye Dön", "Index")
  41. </div>
 
Projemizi çalıştıralım.
 
İlk çalıştırdığımızda karşımıza yazar listesi gelecektir.
 
 
Create New butonuna tıklayalım. Açılan ekranda TextBox’lara verimizi girelim.
 
 
Oluştur butonuna tıklayalım. Sonrasında Listeye Dön diyelim.
 
 
Kaydını girdiğimiz verinin veritabanına (listeye) eklendiğini görebilmekteyiz.
 
 
 
 
Veysel Uğur KIZMAZ
Bilgisayar Mühendisi
veysel@ugurkizmaz.com
www.ugurkizmaz.com