Aracılığıyla paylaş


1. Yineleme – Uygulamayı oluşturma (VB)

Microsoft tarafından

Kodu İndir

İlk yinelemede, Contact Manager'ı mümkün olan en basit şekilde oluştururuz. Temel veritabanı işlemleri için destek ekliyoruz: Oluşturma, Okuma, Güncelleştirme ve Silme (CRUD).

MVC Uygulaması ASP.NET Kişi Yönetimi Oluşturma (VB)

Bu öğretici serisinde, baştan sona bir Kişi Yönetimi uygulamasının tamamını oluşturuyoruz. Contact Manager uygulaması kişi listesi için kişi bilgilerini (adlar, telefon numaraları ve e-posta adresleri) depolamanıza olanak tanır.

Uygulamayı birden çok yineleme üzerinden oluşturuyoruz. Her yinelemede uygulamayı aşamalı olarak iyileştiriyoruz. Bu çoklu yineleme yaklaşımının amacı, her değişikliğin nedenini anlamanıza olanak tanımaktır.

  • Yineleme #1 - Uygulamayı oluşturun. İlk yinelemede, Contact Manager'ı mümkün olan en basit şekilde oluştururuz. Temel veritabanı işlemleri için destek ekliyoruz: Oluşturma, Okuma, Güncelleştirme ve Silme (CRUD).

  • Yineleme #2 - Uygulamanın güzel görünmesini sağlayın. Bu yinelemede, varsayılan ASP.NET MVC görünüm ana sayfasını ve basamaklı stil sayfasını değiştirerek uygulamanın görünümünü iyileştireceğiz.

  • Yineleme #3 - Form doğrulaması ekleyin. Üçüncü yinelemede temel form doğrulaması ekliyoruz. Gerekli form alanlarını tamamlamadan kişilerin form göndermesini engelleriz. Ayrıca e-posta adreslerini ve telefon numaralarını da doğrularız.

  • Yineleme #4 - Uygulamayı gevşek bir şekilde birleştirin. Bu dördüncü yinelemede, Contact Manager uygulamasının bakımını ve değiştirilmesini kolaylaştırmak için çeşitli yazılım tasarım desenlerinden yararlanıyoruz. Örneğin, uygulamamızı Depo desenini ve Bağımlılık Ekleme düzenini kullanacak şekilde yeniden düzenleyeceğiz.

  • Yineleme #5 - Birim testleri oluşturun. Beşinci yinelemede, birim testleri ekleyerek uygulamamızın bakımını ve değiştirilmesini kolaylaştırıyoruz. Veri modeli sınıflarımızla dalga geçiyoruz ve denetleyicilerimiz ve doğrulama mantığımız için birim testleri oluşturuyoruz.

  • Yineleme #6 - Test temelli geliştirmeyi kullanın. Bu altıncı yinelemede, önce birim testleri yazıp birim testlerine kod yazarak uygulamamıza yeni işlevler ekleyeceğiz. Bu yinelemede kişi grupları ekleyeceğiz.

  • Yineleme #7 - Ajax işlevselliğini ekleyin. Yedinci yinelemede Ajax desteği ekleyerek uygulamamızın yanıt hızını ve performansını iyileştiriyoruz.

Bu Yineleme

Bu ilk yinelemede temel uygulamayı derleyeceğiz. Amaç, Contact Manager'ı mümkün olan en hızlı ve en basit şekilde oluşturmaktır. Sonraki yinelemelerde uygulamanın tasarımını iyileştireceğiz.

Contact Manager uygulaması temel bir veritabanı tabanlı uygulamadır. Uygulamayı kullanarak yeni kişiler oluşturabilir, mevcut kişileri düzenleyebilir ve kişileri silebilirsiniz.

Bu yinelemede aşağıdaki adımları tamamlayacağız:

  1. MVC uygulamasını ASP.NET
  2. Kişilerimizi depolamak için veritabanı oluşturma
  3. Microsoft Entity Framework ile veritabanımız için model sınıfı oluşturma
  4. Veritabanındaki tüm kişileri listelememizi sağlayan bir denetleyici eylemi ve görünümü oluşturma
  5. Denetleyici eylemleri ve veritabanında yeni bir kişi oluşturmamızı sağlayan bir görünüm oluşturma
  6. Denetleyici eylemleri ve veritabanında var olan bir kişiyi düzenlememizi sağlayan bir görünüm oluşturma
  7. Denetleyici eylemleri ve veritabanındaki mevcut bir kişiyi silmemizi sağlayan bir görünüm oluşturma

Yazılım Önkoşulları

ASP.NET MVC uygulamalarında, bilgisayarınızda Visual Studio 2008 veya Visual Web Developer 2008 yüklü olmalıdır (Visual Web Developer, Visual Studio'nun tüm gelişmiş özelliklerini içermeyen ücretsiz bir Visual Studio sürümüdür). Visual Studio 2008'in deneme sürümünü veya Visual Web Developer'ı aşağıdaki adresten indirebilirsiniz:

https://www.asp.net/downloads/essential/

Not

Visual Web Developer ile ASP.NET MVC uygulamaları için Visual Web Developer Service Pack 1 yüklü olmalıdır. Service Pack 1 olmadan Web Uygulaması Projeleri oluşturamazsınız.

MVC çerçeve ASP.NET. ASP.NET MVC çerçevesini aşağıdaki adresten indirebilirsiniz:

https://www.asp.net/mvc

Bu öğreticide, veritabanına erişmek için Microsoft Entity Framework'i kullanacağız. Entity Framework, .NET Framework 3.5 Service Pack 1'e dahildir. Bu hizmet paketini aşağıdaki konumdan indirebilirsiniz:

https://www.microsoft.com/download/details.aspx?id=22& desc=dotnet35

Bu indirmelerin her birini tek tek gerçekleştirmeye alternatif olarak, Web Platformu Yükleyicisi'nin (Web PI) avantajlarından yararlanabilirsiniz. Web PI'yi aşağıdaki adresten indirebilirsiniz:

https://www.asp.net/downloads/essential/

ASP.NET MVC Projesi

MVC Web Uygulaması Projesi'ne ASP.NET. Visual Studio'yu başlatın ve Dosya, Yeni Proje menü seçeneğini belirleyin. Yeni Proje iletişim kutusu görüntülenir (bkz. Şekil 1). Web proje türünü ve ASP.NET MVC Web Uygulaması şablonunu seçin. Yeni projenizi ContactManager olarak adlandırın ve Tamam düğmesine tıklayın.

Yeni Proje iletişim kutusunun sağ üst kısmındaki açılan listeden .NET Framework 3.5'in seçili olduğundan emin olun. Aksi takdirde, ASP.NET MVC Web Uygulaması şablonu görünmez.

Yeni Proje iletişim kutusunu gösteren ekran görüntüsü.

Şekil 01: Yeni Proje iletişim kutusu (Tam boyutlu görüntüyü görüntülemek için tıklayın)

MVC uygulaması ASP.NET Birim Testi Projesi Oluştur iletişim kutusu görüntülenir. ASP.NET MVC uygulamanızı oluştururken çözümünüzde birim testi projesi oluşturmak ve eklemek istediğinizi belirtmek için bu iletişim kutusunu kullanabilirsiniz. Bu yinelemede birim testleri oluşturmayacak olsak da, daha sonraki bir yinelemede birim testleri eklemeyi planladığımız için Evet, birim testi projesi oluştur seçeneğini belirlemeniz gerekir. İlk kez yeni bir ASP.NET MVC projesi oluşturduğunuzda Test projesi eklemek, ASP.NET MVC projesi oluşturulduktan sonra test projesi eklemekten çok daha kolaydır.

Not

Visual Web Developer Test projelerini desteklemediğinden, Visual Web Developer kullanırken Birim Testi Projesi Oluştur iletişim kutusunu alamazsınız.

Birim Testi Projesi Oluştur iletişim kutusunu gösteren ekran görüntüsü.

Şekil 02: Birim Testi Projesi Oluştur iletişim kutusu (Tam boyutlu görüntüyü görüntülemek için tıklayın)

ASP.NET MVC uygulaması Visual Studio Çözüm Gezgini penceresinde görünür (bkz. Şekil 3). Çözüm Gezgini penceresini görmüyorsanız, görünüm, Çözüm Gezgini menü seçeneğini belirleyerek bu pencereyi açabilirsiniz. Çözümün iki proje içerdiğine dikkat edin: ASP.NET MVC projesi ve Test projesi. ASP.NET MVC projesi ContactManager, Test projesi ise ContactManager.Tests olarak adlandırılır.

Çözüm Gezgini penceresini gösteren ekran görüntüsü.

Şekil 03: Çözüm Gezgini penceresi (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Proje Örnek Dosyalarını Silme

ASP.NET MVC proje şablonu, denetleyiciler ve görünümler için örnek dosyalar içerir. Yeni bir ASP.NET MVC uygulaması oluşturmadan önce bu dosyaları silmeniz gerekir. bir dosya veya klasöre sağ tıklayıp Sil menü seçeneğini belirleyerek Çözüm Gezgini penceresindeki dosya ve klasörleri silebilirsiniz.

ASP.NET MVC projesinden aşağıdaki dosyaları silmeniz gerekir:

  • \Controllers\HomeController.vb

  • \Views\Home\About.aspx

  • \Views\Home\Index.aspx

Ayrıca Test projesinden aşağıdaki dosyayı silmeniz gerekir:

\Controllers\HomeControllerTest.vb

Veritabanı Oluşturma

Contact Manager uygulaması, veritabanı tabanlı bir web uygulamasıdır. Kişi bilgilerini depolamak için bir veritabanı kullanırız.

Microsoft SQL Server, Oracle, MySQL ve IBM DB2 veritabanları dahil olmak üzere tüm modern veritabanlarıyla ASP.NET MVC çerçevesi. Bu öğreticide bir Microsoft SQL Server veritabanı kullanacağız. Visual Studio'yu yüklediğinizde, Microsoft SQL Server veritabanının ücretsiz bir sürümü olan Microsoft SQL Server Express yükleme seçeneği sunulur.

Çözüm Gezgini penceresindeki App_Data klasörüne sağ tıklayıp Ekle, Yeni Öğe menü seçeneğini belirleyerek yeni bir veritabanı oluşturun. Yeni Öğe Ekle iletişim kutusunda Veri kategorisini ve SQL Server Veritabanı şablonunu seçin (bkz. Şekil 4). Yeni veritabanını ContactManagerDB.mdf adlandırın ve Tamam düğmesine tıklayın.

Yeni bir Microsoft Sequel Server Express veritabanı oluşturmayı gösteren ekran görüntüsü.

Şekil 04: Yeni bir Microsoft SQL Server Express veritabanı oluşturma (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Yeni veritabanını oluşturduktan sonra, veritabanı Çözüm Gezgini penceresindeki App_Data klasöründe görünür. Sunucu Gezgini penceresini açmak ve veritabanına bağlanmak için ContactManager.mdf dosyasına çift tıklayın.

Not

Sunucu Gezgini penceresi, Microsoft Visual Web Developer söz konusu olduğunda Veritabanı Gezgini penceresi olarak adlandırılır.

Veritabanı tabloları, görünümler, tetikleyiciler ve saklı yordamlar gibi yeni veritabanı nesneleri oluşturmak için Sunucu Gezgini penceresini kullanabilirsiniz. Tablolar klasörüne sağ tıklayın ve Yeni Tablo Ekle menü seçeneğini belirleyin. Veritabanı Tablosu Tasarım Aracı görüntülenir (bkz. Şekil 5).

Veritabanı Tablosu Tasarım Aracı gösteren ekran görüntüsü.

Şekil 05: Veritabanı Tablosu Tasarım Aracı (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Aşağıdaki sütunları içeren bir tablo oluşturmamız gerekir:

Sütun Adı Veri Türü Null'lara İzin Ver
Id int yanlış
FirstName nvarchar(50) yanlış
LastName nvarchar(50) yanlış
Telefon nvarchar(50) yanlış
E-posta nvarchar(255) yanlış

İlk sütun olan Id sütunu özeldir. Kimlik sütununu Kimlik sütunu ve Birincil Anahtar sütunu olarak işaretlemeniz gerekir. Sütun Özellikleri'ni genişleterek (Şekil 6'nın altına bakın) ve Kimlik Belirtimi özelliğine kadar aşağı kaydırarak sütunun bir Kimlik sütunu olduğunu belirtirsiniz. (Is Identity) özelliğini Evet değerine ayarlayın.

Sütunu seçip bir anahtar simgesine tıklayarak sütunu Birincil Anahtar sütunu olarak işaretlersiniz. Bir sütun Birincil Anahtar sütunu olarak işaretlendikten sonra, sütunun yanında bir anahtar simgesi görünür (bkz. Şekil 6).

Tabloyu oluşturmayı tamamladıktan sonra, yeni tabloyu kaydetmek için Kaydet düğmesine (disket simgesi içeren düğme) tıklayın. Yeni tablonuza Kişiler adını verin.

Kişiler veritabanı tablosunu oluşturmayı tamamladıktan sonra tabloya bazı kayıtlar eklemelisiniz. Sunucu Gezgini penceresinde Kişiler tablosuna sağ tıklayın ve Tablo Verilerini Göster menü seçeneğini belirleyin. Görüntülenen kılavuza bir veya daha fazla kişi girin.

Veri Modeli Oluşturma

ASP.NET MVC uygulaması Modeller, Görünümler ve Denetleyicilerden oluşur. İlk olarak, önceki bölümde oluşturduğumuz Kişiler tablosunu temsil eden bir Model sınıfı oluşturacağız.

Bu öğreticide, veritabanından otomatik olarak bir model sınıfı oluşturmak için Microsoft Entity Framework'i kullanacağız.

Not

ASP.NET MVC çerçevesi hiçbir şekilde Microsoft Entity Framework'e bağlı değildir. ASP.NET MVC'yi NHibernate, LINQ to SQL veya ADO.NET gibi alternatif veritabanı erişim teknolojileriyle kullanabilirsiniz.

Veri modeli sınıflarını oluşturmak için şu adımları izleyin:

  1. Çözüm Gezgini penceresinde Modeller klasörüne sağ tıklayın ve Ekle, Yeni Öğe'yi seçin. Yeni Öğe Ekle iletişim kutusu görüntülenir (bkz. Şekil 6).
  2. Veri kategorisini ve ADO.NET Varlık Veri Modeli şablonunu seçin. Veri modelinizi ContactManagerModel.edmx olarak adlandırın ve Ekle düğmesine tıklayın. Varlık Veri Modeli sihirbazı görüntülenir (bkz. Şekil 7).
  3. Model İçeriğiNi Seçin adımında Veritabanından oluştur'u seçin (bkz. Şekil 7).
  4. Veri Bağlantınızı Seçin adımında, ContactManagerDB.mdf veritabanını seçin ve Varlık Bağlantısı Ayarları için ContactManagerDBEntities adını girin (bkz. Şekil 8).
  5. Veritabanı Nesnelerinizi Seçin adımında Tablolar etiketli onay kutusunu seçin (bkz. Şekil 9). Veri modeli, veritabanınızda bulunan tüm tabloları içerir (yalnızca bir tane vardır, Kişiler tablosu). Ad alanı Modellerini girin. Sihirbazı tamamlamak için Son düğmesine tıklayın.

Yeni Öğe Ekle iletişim kutusunu gösteren ekran görüntüsü.

Şekil 06: Yeni Öğe Ekle iletişim kutusu (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Model İçeriğini Seç'i gösteren ekran görüntüsü.

Şekil 07: Model İçeriğini Seçin (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Veri Bağlantınızı Seçin'i gösteren ekran görüntüsü.

Şekil 08: Veri Bağlantınızı Seçin (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Veritabanı Nesnelerinizi Seçin'i gösteren ekran görüntüsü.

Şekil 09: Veritabanı Nesnelerinizi Seçin (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Varlık Veri Modeli Sihirbazı'nı tamamladıktan sonra Varlık Veri Modeli Tasarım Aracı görüntülenir. Tasarımcı, modellenen her tabloya karşılık gelen bir sınıf görüntüler. Kişiler adlı bir sınıf görmeniz gerekir.

Varlık Veri Modeli sihirbazı, veritabanı tablo adlarını temel alan sınıf adları oluşturur. Neredeyse her zaman sihirbaz tarafından oluşturulan sınıfın adını değiştirmeniz gerekir. Tasarımcıda Kişiler sınıfına sağ tıklayın ve Yeniden Adlandır menü seçeneğini belirleyin. Sınıfın adını Kişiler (çoğul) olan Kişi (tekil) olarak değiştirin. Sınıf adını değiştirdikten sonra, sınıfın Şekil 10 gibi görünmesi gerekir.

Kişi sınıfını gösteren ekran görüntüsü.

Şekil 10: Kişi sınıfı (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Bu noktada veritabanı modelimizi oluşturduk. Veritabanımızda belirli bir kişi kaydını temsil etmek için Contact sınıfını kullanabiliriz.

Ev Denetleyicisi Oluşturma

Sonraki adım, Giriş denetleyicimizi oluşturmaktır. Giriş denetleyicisi, bir ASP.NET MVC uygulamasında çağrılan varsayılan denetleyicidir.

Çözüm Gezgini penceresinde Denetleyiciler klasörüne sağ tıklayıp Ekle, Denetleyici menü seçeneğini belirleyerek Giriş denetleyicisi sınıfını oluşturun (bkz. Şekil 11). Oluştur, Güncelleştir ve Ayrıntılar senaryoları için Eylem yöntemleri ekle etiketli onay kutusuna dikkat edin. Ekle düğmesine tıklamadan önce bu onay kutusunun işaretli olduğundan emin olun.

Giriş denetleyicisini eklemeyi gösteren ekran görüntüsü.

Şekil 11: Giriş denetleyicisini ekleme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Giriş denetleyicisini oluşturduğunuzda, Sınıfı Listeleme 1'de alırsınız.

Liste 1 - Controllers\HomeController.vb

Public Class HomeController
    Inherits System.Web.Mvc.Controller

    '
    ' GET: /Home/

    Function Index() As ActionResult
        Return View()
    End Function

    '
    ' GET: /Home/Details/5

    Function Details(ByVal id As Integer) As ActionResult
        Return View()
    End Function

    '
    ' GET: /Home/Create

    Function Create() As ActionResult
        Return View()
    End Function

    '
    ' POST: /Home/Create

    <AcceptVerbs(HttpVerbs.Post)> _
    Function Create(ByVal collection As FormCollection) As ActionResult
        Try
            ' TODO: Add insert logic here
            Return RedirectToAction("Index")
        Catch
            Return View()
        End Try
    End Function

    '
    ' GET: /Home/Edit/5

    Function Edit(ByVal id As Integer) As ActionResult
        Return View()
    End Function

    '
    ' POST: /Home/Edit/5

    <AcceptVerbs(HttpVerbs.Post)> _
    Function Edit(ByVal id As Integer, ByVal collection As FormCollection) As ActionResult
        Try
            ' TODO: Add update logic here

            Return RedirectToAction("Index")
        Catch
            Return View()
        End Try
    End Function
End Class

Kişileri Listeleme

Kayıtları Kişiler veritabanı tablosunda görüntülemek için bir Index() eylemi ve dizin görünümü oluşturmamız gerekir.

Giriş denetleyicisi zaten bir Index() eylemi içeriyor. Bu yöntemi Liste 2 gibi görünecek şekilde değiştirmeliyiz.

Liste 2 - Controllers\HomeController.vb

Public Class HomeController
    Inherits System.Web.Mvc.Controller

    Private _entities As New ContactManagerDBEntities()

    '
    ' GET: /Home/

    Function Index() As ActionResult
        Return View(_entities.ContactSet.ToList())
    End Function
…

Liste 2'deki Giriş denetleyicisi sınıfının _entities adlı özel bir alan içerdiğine dikkat edin. _entities alanı, veri modelindeki varlıkları temsil eder. veritabanıyla iletişim kurmak için _entities alanını kullanırız.

Index() yöntemi, Kişiler veritabanı tablosundaki tüm kişileri temsil eden bir görünüm döndürür. İfade _entities. ContactSet.ToList() kişi listesini genel liste olarak döndürür.

Artık Dizin denetleyicisini oluşturduğumuza göre, bir sonraki adımda Dizin görünümünü oluşturmamız gerekir. Dizin görünümünü oluşturmadan önce Derle, Çözüm Oluştur menü seçeneğini belirleyerek uygulamanızı derleyin. Model sınıflarının listesinin Görünüm Ekle iletişim kutusunda görüntülenmesi için bir görünüm eklemeden önce projenizi her zaman derlemeniz gerekir.

Index() yöntemine sağ tıklayıp Görünüm Ekle menü seçeneğini belirleyerek Dizin görünümünü oluşturursunuz (bkz. Şekil 12). Bu menü seçeneğinin seçilmesi Görünüm Ekle iletişim kutusunu açar (bkz. Şekil 13).

Dizin görünümünü eklemeyi gösteren ekran görüntüsü.

Şekil 12: Dizin görünümünü ekleme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Görünüm Ekle iletişim kutusunda, Kesin olarak yazılan görünüm oluştur etiketli onay kutusunu işaretleyin. ContactManager.Contact veri sınıfını ve İçeriği görüntüle Listesini seçin. Bu seçeneklerin seçilmesi, Kişi kayıtlarının listesini görüntüleyen bir görünüm oluşturur.

Görünüm Ekle iletişim kutusunu gösteren ekran görüntüsü.

Şekil 13: Görünüm Ekle iletişim kutusu (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Ekle düğmesine tıkladığınızda, Liste 3'teki Dizin görünümü oluşturulur. <Dosyanın en üstünde görüntülenen %@ Sayfa %> yönergesine dikkat edin. Dizin görünümü ViewPage<IEnumerable<ContactManager.Models.Contact>> sınıfından devralınır. Başka bir deyişle, görünümdeki Model sınıfı Kişi varlıklarının listesini temsil eder.

Dizin görünümünün gövdesi, Model sınıfı tarafından temsil edilen kişilerin her birinde yinelenen bir foreach döngüsü içerir. Contact sınıfının her özelliğinin değeri bir HTML tablosu içinde görüntülenir.

Liste 3 - Views\Home\Index.aspx (değiştirilmemiş)

<%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage(Of IEnumerable(Of ContactManager.Contact))" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<title>Index</title>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <h2>Index</h2>

    <p>
        <%=Html.ActionLink("Create New", "Create")%>
    </p>
    
    <table>
        <tr>
            <th></th>
            <th>
                Id
            </th>
            <th>
                FirstName
            </th>
            <th>
                LastName
            </th>
            <th>
                Phone
            </th>
            <th>
                Email
            </th>
        </tr>

    <% For Each item In Model%>
    
        <tr>
            <td>
                <%=Html.ActionLink("Edit", "Edit", New With {.id = item.Id})%> |
                <%=Html.ActionLink("Details", "Details", New With {.id = item.Id})%>
            </td>
            <td>
                <%=Html.Encode(item.Id)%>
            </td>
            <td>
                <%=Html.Encode(item.FirstName)%>
            </td>
            <td>
                <%=Html.Encode(item.LastName)%>
            </td>
            <td>
                <%=Html.Encode(item.Phone)%>
            </td>
            <td>
                <%=Html.Encode(item.Email)%>
            </td>
        </tr>
    
    <% Next%>

    </table>

</asp:Content>

Dizin görünümünde bir değişiklik yapmamız gerekir. Ayrıntılar görünümü oluşturmadığımız için Ayrıntılar bağlantısını kaldırabiliriz. Dizin görünümünde aşağıdaki kodu bulun ve kaldırın:

{.id = öğe. Kimlik})%>

Dizin görünümünü değiştirdikten sonra, Contact Manager uygulamasını çalıştırabilirsiniz. Hata Ayıkla, Hata Ayıklamayı Başlat menü seçeneğini belirleyin veya yalnızca F5 tuşuna basın. Uygulamayı ilk kez çalıştırdığınızda, Şekil 14'te iletişim kutusunu alırsınız. Hata ayıklamayı etkinleştirmek için Web.config dosyasını değiştir seçeneğini belirleyin ve Tamam düğmesine tıklayın.

Hata ayıklamayı etkinleştirmeyi gösteren ekran görüntüsü.

Şekil 14: Hata ayıklamayı etkinleştirme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Dizin görünümü varsayılan olarak döndürülür. Bu görünüm, Kişiler veritabanı tablosundaki tüm verileri listeler (bkz. Şekil 15).

Dizin görünümünü gösteren ekran görüntüsü.

Şekil 15: Dizin görünümü (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Dizin görünümünde, görünümün en altında Yeni Oluştur etiketli bir bağlantı olduğuna dikkat edin. Sonraki bölümde yeni kişiler oluşturmayı öğreneceksiniz.

Yeni Kişiler Oluşturma

Kullanıcıların yeni kişiler oluşturmasını sağlamak için Giriş denetleyicisine iki Create() eylemi eklememiz gerekir. Yeni kişi oluşturmak için HTML formu döndüren bir Create() eylemi oluşturmamız gerekiyor. Yeni kişinin gerçek veritabanı ekleme işlemini gerçekleştiren ikinci bir Create() eylemi oluşturmamız gerekir.

Giriş denetleyicisine eklememiz gereken yeni Create() yöntemleri Liste 4'te yer alır.

Listeleme 4 - Controllers\HomeController.vb (Create yöntemleriyle)

'
' GET: /Home/Create

Function Create() As ActionResult
    Return View()
End Function

'
' POST: /Home/Create

<AcceptVerbs(HttpVerbs.Post)> _
Function Create(<Bind(Exclude:="Id")> ByVal contactToCreate As Contact) As ActionResult
    If Not ModelState.IsValid Then
        Return View()
    End If

    Try
        _entities.AddToContactSet(contactToCreate)
        _entities.SaveChanges()
        Return RedirectToAction("Index")
    Catch
        Return View()
    End Try
End Function

İlk Create() yöntemi bir HTTP GET ile çağrılabilirken, ikinci Create() yöntemi yalnızca bir HTTP POST tarafından çağrılabilir. Başka bir deyişle, ikinci Create() yöntemi yalnızca html formu gönderildiğinde çağrılabilir. İlk Create() yöntemi, yeni kişi oluşturmak için HTML formunu içeren bir görünüm döndürür. İkinci Create() yöntemi çok daha ilginçtir: yeni kişiyi veritabanına ekler.

İkinci Create() yönteminin Contact sınıfının bir örneğini kabul etmek için değiştirildiğine dikkat edin. HTML formundan gönderilen form değerleri, ASP.NET MVC çerçevesi tarafından bu Contact sınıfına otomatik olarak bağlanır. HTML Oluştur formundaki her form alanı Contact parametresinin bir özelliğine atanır.

Contact parametresinin [Bind] özniteliğiyle süslenmiş olduğuna dikkat edin. [Bind] özniteliği, Kişi Kimliği özelliğini bağlamanın dışında tutmak için kullanılır. Id özelliği bir Identity özelliğini temsil ettiğinden, Id özelliğini ayarlamak istemiyoruz.

Create() yönteminin gövdesinde Entity Framework, veritabanına yeni Kişi eklemek için kullanılır. Yeni Kişi mevcut Kişiler kümesine eklenir ve bu değişiklikleri temel alınan veritabanına geri göndermek için SaveChanges() yöntemi çağrılır.

İki Create() yönteminden birini sağ tıklatıp Görünüm Ekle menü seçeneğini belirleyerek yeni Kişiler oluşturmak için bir HTML formu oluşturabilirsiniz (bkz. Şekil 16).

Oluştur görünümünü eklemeyi gösteren ekran görüntüsü.

Şekil 16: Oluştur görünümünü ekleme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Görünüm Ekle iletişim kutusunda ContactManager.Contact sınıfını ve görüntüleme içeriği için Oluştur seçeneğini seçin (bkz. Şekil 17). Ekle düğmesine tıkladığınızda, otomatik olarak bir Oluştur görünümü oluşturulur.

Bir sayfanın patladığını gösteren ekran görüntüsü.

Şekil 17: Bir sayfanın patladığını görme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Oluştur görünümü, Contact sınıfının özelliklerinin her biri için form alanları içerir. Oluştur görünümünün kodu Listeleme 5'e dahil edilir.

Liste 5 - Views\Home\Create.aspx

<%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage(Of ContactManager.Contact)" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<title>Create</title>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <h2>Create</h2>

    <%= Html.ValidationSummary() %>

    <% Using Html.BeginForm()%>

        <fieldset>
            <legend>Fields</legend>
            <p>
                <label for="FirstName">FirstName:</label>
                <%= Html.TextBox("FirstName") %>
                <%= Html.ValidationMessage("FirstName", "*") %>
            </p>
            <p>
                <label for="LastName">LastName:</label>
                <%= Html.TextBox("LastName") %>
                <%= Html.ValidationMessage("LastName", "*") %>
            </p>
            <p>
                <label for="Phone">Phone:</label>
                <%= Html.TextBox("Phone") %>
                <%= Html.ValidationMessage("Phone", "*") %>
            </p>
            <p>
                <label for="Email">Email:</label>
                <%= Html.TextBox("Email") %>
                <%= Html.ValidationMessage("Email", "*") %>
            </p>
            <p>
                <input type="submit" value="Create" />
            </p>
        </fieldset>

    <% End Using %>

    <div>
        <%=Html.ActionLink("Back to List", "Index") %>
    </div>

</asp:Content>

Create() yöntemlerini değiştirdikten ve Oluştur görünümünü ekledikten sonra, Kişi Yöneticisi uygulamasını çalıştırabilir ve yeni kişiler oluşturabilirsiniz. Dizin görünümünde görüntülenen Yeni Oluştur bağlantısına tıklayarak Oluştur görünümüne gidin. Görünümü Şekil 18'de görmeniz gerekir.

Görünüm Oluştur'u gösteren ekran görüntüsü.

Şekil 18: Görünüm Oluştur (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Kişileri Düzenleme

Kişi kaydını düzenleme işlevselliğini eklemek, yeni kişi kayıtları oluşturma işlevselliğini eklemeye çok benzer. İlk olarak, Giriş denetleyicisi sınıfına iki yeni Edit yöntemi eklemeliyiz. Bu yeni Edit() yöntemleri Liste 6'da yer alır.

Listeleme 6 - Controllers\HomeController.vb (Düzenleme yöntemleriyle)

'
' GET: /Home/Edit/5

Function Edit(ByVal id As Integer) As ActionResult
    Dim contactToEdit = (from c in _entities.ContactSet _
                       where c.Id = id _
                       select c).FirstOrDefault()

    Return View(contactToEdit)
End Function

'
' POST: /Home/Edit/5

<AcceptVerbs(HttpVerbs.Post)> _
Function Edit(ByVal contactToEdit As Contact) As ActionResult
    If Not ModelState.IsValid Then
        Return View()
    End If

    Try
        Dim originalContact = (from c in _entities.ContactSet _
                         where c.Id = contactToEdit.Id _
                         select c).FirstOrDefault()
        _entities.ApplyPropertyChanges( originalContact.EntityKey.EntitySetName, contactToEdit)
        _entities.SaveChanges()
        Return RedirectToAction("Index")
    Catch
        Return View()
    End Try
End Function

İlk Edit() yöntemi bir HTTP GET işlemi tarafından çağrılır. Bu yönteme, düzenlenmekte olan kişi kaydının kimliğini temsil eden bir Id parametresi geçirilir. Entity Framework, kimlikle eşleşen bir kişiyi almak için kullanılır. Kaydı düzenlemek için HTML formu içeren bir görünüm döndürülür.

İkinci Edit() yöntemi, veritabanında gerçek güncelleştirmeyi gerçekleştirir. Bu yöntem, Contact sınıfının bir örneğini parametre olarak kabul eder. ASP.NET MVC çerçevesi, Düzenleme formundaki form alanlarını otomatik olarak bu sınıfa bağlar. Kişi düzenlerken [Bind] özniteliğini eklemediğinize dikkat edin (Id özelliğinin değerine ihtiyacımız var).

Entity Framework, değiştirilen Kişiyi veritabanına kaydetmek için kullanılır. İlk olarak özgün Kişi veritabanından alınmalıdır. Ardından, Entity Framework ApplyPropertyChanges() yöntemi, kişideki değişiklikleri kaydetmek için çağrılır. Son olarak, değişiklikleri temel alınan veritabanında kalıcı hale getirmek için Entity Framework SaveChanges() yöntemi çağrılır.

Düzenle() yöntemine sağ tıklayıp Görünüm Ekle menü seçeneğini belirleyerek Düzenleme formunu içeren görünümü oluşturabilirsiniz. Görünüm Ekle iletişim kutusunda ContactManager.Models.Contact sınıfını ve Görünümü düzenle içeriğini seçin (bkz. Şekil 19).

Düzenleme Görünümü eklemeyi gösteren ekran görüntüsü.

Şekil 19: Düzenleme Görünümü Ekleme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Ekle düğmesine tıkladığınızda, otomatik olarak yeni bir Düzenleme görünümü oluşturulur. Oluşturulan HTML formu, Contact sınıfının özelliklerinin her birine karşılık gelen alanlar içerir (bkz. Listeleme 7).

Liste 7 - Views\Home\Edit.aspx

<%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage(Of ContactManager.Contact)" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<title>Edit</title>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <h2>Edit</h2>

    <%=Html.ValidationSummary()%>

    <% Using Html.BeginForm() %>

        <fieldset>
            <legend>Fields</legend>
            <p>
                <label for="FirstName">FirstName:</label>
                <%= Html.TextBox("FirstName") %>
                <%= Html.ValidationMessage("FirstName", "*") %>
            </p>
            <p>
                <label for="LastName">LastName:</label>
                <%= Html.TextBox("LastName") %>
                <%= Html.ValidationMessage("LastName", "*") %>
            </p>
            <p>
                <label for="Phone">Phone:</label>
                <%= Html.TextBox("Phone") %>
                <%= Html.ValidationMessage("Phone", "*") %>
            </p>
            <p>
                <label for="Email">Email:</label>
                <%= Html.TextBox("Email") %>
                <%= Html.ValidationMessage("Email", "*") %>
            </p>
            <p>
                <input type="submit" value="Save" />
            </p>
        </fieldset>

    <% End Using %>

    <div>
        <%=Html.ActionLink("Back to List", "Index") %>
    </div>

</asp:Content>

Kişileri Silme

Kişileri silmek istiyorsanız, Giriş denetleyicisi sınıfına iki Delete() eylemi eklemeniz gerekir. İlk Delete() eylemi bir silme onay formu görüntüler. İkinci Delete() eylemi gerçek silme işlemini gerçekleştirir.

Not

Daha sonra, Yineleme #7'de Kişi Yöneticisi'ni değiştirerek tek adımlı Ajax silmeyi desteklemesini sileriz.

İki yeni Delete() yöntemi Liste 8'de yer alır.

Listeleme 8 - Controllers\HomeController.vb (Silme yöntemleri)

'
' GET: /Home/Delete/5

Function Delete(ByVal id As Integer) As ActionResult
    Dim contactToDelete = (from c in _entities.ContactSet _
                       where c.Id = id _
                       select c).FirstOrDefault()

    Return View(contactToDelete)
End Function

'
' POST: /Home/Delete/5

<AcceptVerbs(HttpVerbs.Post)> _
Function Delete(ByVal contactToDelete As Contact) As ActionResult
    Try
        Dim originalContact = (from c in _entities.ContactSet _
                         where c.Id = contactToDelete.Id _
                         select c).FirstOrDefault()
        _entities.DeleteObject(originalContact)
        _entities.SaveChanges()
        Return RedirectToAction("Index")
    Catch
        Return View()
    End Try
End Function

İlk Delete() yöntemi, veritabanından kişi kaydını silmek için bir onay formu döndürür (bkz. Şekil20). İkinci Delete() yöntemi, veritabanında gerçek silme işlemini gerçekleştirir. Özgün kişi veritabanından alındıktan sonra, veritabanı silme işlemini gerçekleştirmek için Entity Framework DeleteObject() ve SaveChanges() yöntemleri çağrılır.

Silme onayı görünümünü gösteren ekran görüntüsü.

Şekil 20: Silme onayı görünümü (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Kişi kayıtlarını silmek için bir bağlantı içermesi için Dizin görünümünü değiştirmemiz gerekir (bkz. Şekil 21). Aşağıdaki kodu, Düzenle bağlantısını içeren tablo hücresine eklemeniz gerekir:

{.id = öğe. Kimlik})%>

Düzenle bağlantısına sahip Dizin görünümünü gösteren ekran görüntüsü.

Şekil 21: Düzenle bağlantısıyla dizin görünümü (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Ardından silme onayı görünümünü oluşturmamız gerekir. Giriş denetleyicisi sınıfında Delete() yöntemine sağ tıklayın ve Görünüm Ekle menü seçeneğini belirleyin. Görünüm Ekle iletişim kutusu görüntülenir (bkz. Şekil 22).

Liste, Oluştur ve Düzenle görünümlerinden farklı olarak, Görünüm Ekle iletişim kutusu Bir Sil görünümü oluşturma seçeneği içermez. Bunun yerine ContactManager.Models.Contact veri sınıfını ve Boş görünüm içeriğini seçin. Boş görünüm içeriği seçeneğinin seçilmesi, görünümü kendimiz oluşturmamızı gerektirir.

Silme onayı görünümünü eklemeyi gösteren ekran görüntüsü.

Şekil 22: Silme onayı görünümünü ekleme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Sil görünümünün içeriği Liste 9'da yer alır. Bu görünüm, belirli bir kişinin silinmesi gerekip gerekmediğini onaylayan bir form içerir (bkz. Şekil 21).

Liste 9 - Views\Home\Delete.aspx

<%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage(Of ContactManager.Contact)" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<title>Delete</title>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <h2>Delete</h2>
    
    <p>
    Are you sure that you want to delete the entry for
    <%= Model.FirstName %> <%= Model.LastName %>?
    </p>

    <% Using Html.BeginForm(New With { .Id = Model.Id }) %>
       <p> 
            <input type="submit" value="Delete" />
        </p>
    <% End Using %>

    <div>
        <%=Html.ActionLink("Back to List", "Index") %>
    </div>

</asp:Content>

Varsayılan Denetleyicinin Adını Değiştirme

Kişilerle çalışmak için denetleyici sınıfımızın adının HomeController sınıfı olması sizi rahatsız edebilir. Denetleyicinin adı ContactController olması gerekmez mi?

Bu sorunu düzeltmek yeterince kolaydır. İlk olarak, Giriş denetleyicisinin adını yeniden düzenlememiz gerekir. Visual Studio Code Düzenleyici HomeController sınıfını açın, sınıfın adına sağ tıklayın ve Yeniden Adlandır menü seçeneğini belirleyin. Bu menü seçeneğinin seçilmesi, Yeniden Adlandır iletişim kutusunu açar.

Denetleyici adını yeniden düzenlemeyi gösteren ekran görüntüsü.

Şekil 23: Denetleyici adını yeniden düzenleme (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Yeniden Adlandır iletişim kutusunun kullanılmasını gösteren ekran görüntüsü.

Şekil 24: Yeniden Adlandır iletişim kutusunu kullanma (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Denetleyici sınıfınızı yeniden adlandırırsanız Visual Studio, Görünümler klasöründeki klasörün adını da güncelleştirir. Visual Studio, \Views\Home klasörünü \Views\Contact klasörüne yeniden adlandırır.

Bu değişikliği yaptıktan sonra, uygulamanızın artık bir Giriş denetleyicisi olmayacaktır. Uygulamanızı çalıştırdığınızda, Şekil 25'teki hata sayfasını alırsınız.

Varsayılan denetleyici olmadığını gösteren ekran görüntüsü.

Şekil 25: Varsayılan denetleyici yok (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Giriş denetleyicisi yerine Kişi denetleyicisini kullanmak için Global.asax dosyasındaki varsayılan yolu güncelleştirmemiz gerekir. Global.asax dosyasını açın ve varsayılan yol tarafından kullanılan varsayılan denetleyiciyi değiştirin (bkz. Listeleme 10).

Liste 10 - Global.asax.vb

Public Class MvcApplication
    Inherits System.Web.HttpApplication

    Shared Sub RegisterRoutes(ByVal routes As RouteCollection)
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}")

        ' MapRoute takes the following parameters, in order:
        ' (1) Route name
        ' (2) URL with parameters
        ' (3) Parameter defaults
        routes.MapRoute( _
            "Default", _
            "{controller}/{action}/{id}", _
            New With {.controller = "Home", .action = "Index", .id = ""} _
        )

    End Sub

    Sub Application_Start()
        RegisterRoutes(RouteTable.Routes)
    End Sub
End Class

Bu değişiklikleri yaptıktan sonra, Kişi Yöneticisi doğru şekilde çalışır. Şimdi, varsayılan denetleyici olarak Contact denetleyici sınıfını kullanacaktır.

Özet

Bu ilk yinelemede, mümkün olan en hızlı şekilde temel bir Contact Manager uygulaması oluşturduk. Denetleyicilerimiz ve görünümlerimiz için ilk kodu otomatik olarak oluşturmak için Visual Studio'nun avantajlarından yararlandık. Veritabanı modeli sınıflarımızı otomatik olarak oluşturmak için Entity Framework'ün avantajlarından da yararlandık.

Şu anda Contact Manager uygulamasıyla kişi kayıtlarını listeleyebilir, oluşturabilir, düzenleyebilir ve silebiliriz. Başka bir deyişle, veritabanı tabanlı bir web uygulaması için gereken tüm temel veritabanı işlemlerini gerçekleştirebiliriz.

Ne yazık ki uygulamamızda bazı sorunlar var. İlk ve ben bunu itiraf tereddüt, Contact Manager uygulaması en çekici uygulama değildir. Biraz tasarım çalışması gerekiyor. Sonraki yinelemede, uygulamanın görünümünü geliştirmek için varsayılan görünüm ana sayfasını ve basamaklı stil sayfasını nasıl değiştirebileceğimizi inceleyeceğiz.

İkincisi, herhangi bir form doğrulaması uygulamadık. Örneğin, form alanlarından herhangi biri için değer girmeden Kişi oluştur formunu göndermenizi engelleyecek hiçbir şey yoktur. Ayrıca, geçersiz telefon numaraları ve e-posta adresleri girebilirsiniz. 3. yinelemede form doğrulama sorununu çözmeye başlıyoruz.

Son olarak, en önemlisi, Contact Manager uygulamasının geçerli yinelemesi kolayca değiştirilemez veya korunamaz. Örneğin, veritabanı erişim mantığı doğrudan denetleyici eylemlerine uygulanır. Bu, denetleyicilerimizi değiştirmeden veri erişim kodumuzu değiştiremeyeceğimiz anlamına gelir. Sonraki yinelemelerde, Contact Manager'ı değiştirmek için daha dayanıklı hale getirmek için uygulayabileceğiniz yazılım tasarım desenlerini keşfedeceğiz.