Aracılığıyla paylaş


Model bağlama ve web formları ile verileri alma ve görüntüleme

Bu öğretici serisi, ASP.NET Web Forms projesiyle model bağlama kullanmanın temel yönlerini gösterir. Model bağlama, veri kaynağı nesneleriyle (ObjectDataSource veya SqlDataSource gibi) uğraşmaktan daha kolay veri etkileşimi sağlar. Bu seri giriş düzeyindeki konularla başlar ve sonraki derslerde daha ileri kavramlara geçilir.

Model bağlama düzeni tüm veri erişim teknolojileriyle çalışır. Bu öğreticide Entity Framework kullanacaksınız, ancak size en çok tanıdık gelen veri erişim teknolojisini kullanabilirsiniz. GridView, ListView, DetailsView veya FormView denetimi gibi veriye bağlı bir sunucu denetiminden, verileri seçmek, güncelleştirmek, silmek ve oluşturmak için kullanılacak yöntemlerin adlarını belirtirsiniz. Bu öğreticide SelectMethod için bir değer belirteceğiz.

Bu yöntemde, verileri almak için mantığı sağlarsınız. Sonraki öğreticide UpdateMethod, DeleteMethod ve InsertMethod değerlerini ayarlayacaksınız.

Projenin tamamını C# veya Visual Basic'te indirebilirsiniz . İndirilebilir kod Visual Studio 2012 ve sonraki sürümlerle çalışır. Bu öğreticide gösterilen Visual Studio 2017 şablonundan biraz farklı olan Visual Studio 2012 şablonunu kullanır.

Öğreticide uygulamayı Visual Studio'da çalıştırıyorsunuz. Ayrıca uygulamayı bir barındırma sağlayıcısına dağıtabilir ve İnternet üzerinden kullanılabilir hale getirebilirsiniz. Microsoft, 10 adede kadar web sitesi için ücretsiz internet barındırma hizmeti sunar.
ücretsiz Azure deneme hesabı. Azure App Service Web Apps'e Visual Studio web projesi dağıtma hakkında bilgi için Visual Studio kullanarak ASP.NET Web Dağıtımı serisine bakın. Bu öğreticide, SQL Server veritabanınızı Azure SQL Veritabanı'na dağıtmak için Entity Framework Code First Migrations'ın nasıl kullanılacağı da gösterilir.

Öğreticide kullanılan yazılım sürümleri

  • Microsoft Visual Studio 2017 veya Microsoft Visual Studio Community 2017

Bu öğretici, Visual Studio 2012 ve Visual Studio 2013 ile de çalışır, ancak kullanıcı arabiriminde ve proje şablonunda bazı farklılıklar vardır.

Oluşturacağınız şeyler

Bu öğreticide şunları yapacaksınız:

  • Kurslara kayıtlı öğrencilerle bir üniversiteyi yansıtan veri nesneleri oluşturma
  • Nesnelerden veritabanı tabloları oluşturma
  • Veritabanını test verileriyle doldurma
  • Verileri web formunda görüntüleme

Projeyi oluşturma

  1. Visual Studio 2017'de ContosoUniversityModelBinding adlı bir ASP.NET Web Uygulaması (.NET Framework) projesi oluşturun.

    proje oluşturma

  2. Tamam'ı seçin. Şablon seçmek için iletişim kutusu görüntülenir.

    web formlarını seçme

  3. Web Forms şablonunu seçin.

  4. Gerekirse kimlik doğrulamasını Tek Tek Kullanıcı Hesapları olarak değiştirin.

  5. Projeyi oluşturmak için Tamam'ı seçin.

Site görünümünü değiştirme

Site görünümünü özelleştirmek için birkaç değişiklik yapın.

  1. Site.Master dosyasını açın.

  2. Başlığı, ASP.NET Uygulamam'ı değil Contoso Üniversitesi'ni görüntüleyecek şekilde değiştirin.

    <title><%: Page.Title %> - Contoso University</title>
    
  3. Uygulama adı üst bilgi metnini Contoso University olarak değiştirin.

    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" runat="server" href="~/">Contoso University</a>
    </div>
    
  4. Gezinti üst başlığındaki bağlantıları siteye uygun olanlarla değiştirin.

    Hakkında ve Kişi bağlantılarını kaldırın ve bunun yerine, oluşturacağınız Öğrenciler sayfasının bağlantısını kaldırın.

    <ul class="nav navbar-nav">
        <li><a runat="server" href="~/">Home</a></li>
        <li><a runat="server" href="~/Students">Students</a></li>
    </ul>
    
  5. Site.Master dosyasını kaydedin.

Öğrenci verilerini görüntülemek için web formu ekleme

  1. Çözüm Gezgini'nde projenize sağ tıklayın, Ekle'yi ve ardından Yeni Öğe'yi seçin.

  2. Yeni Öğe Ekle iletişim kutusunda, Ana Sayfalı Web Formu şablonunu seçin ve Students.aspx olarak adlandırın.

    sayfa oluştur

  3. Add (Ekle) seçeneğini belirleyin.

  4. Web formunun ana sayfası için Site.Master'ı seçin.

  5. Tamam'ı seçin.

Veri modelini ekleme

Models klasörüne UniversityModels.cs adlı bir sınıf ekleyin.

  1. Modeller'e sağ tıklayın, Ekle'yi ve ardından Yeni Öğe'yi seçin. Yeni Öğe Ekle iletişim kutusu görüntülenir.

  2. Sol gezinti menüsünden Kod'a ve ardından Sınıf'a tıklayın.

    model sınıfı oluştur

  3. Sınıf UniversityModels.cs adlandırın ve Ekle'yi seçin.

    Bu dosyada SchoolContext, Student, Enrollmentve Course sınıflarını aşağıdaki gibi tanımlayın:

    using System;
    using System.Collections.Generic;
    using System.Data.Entity;
    using System.ComponentModel.DataAnnotations;
    
    namespace ContosoUniversityModelBinding.Models
    {
        public class SchoolContext : DbContext
        {
            public DbSet<Student> Students { get; set; }
            public DbSet<Enrollment> Enrollments { get; set; }
            public DbSet<Course> Courses { get; set; }
        }
    
        public class Student
        {
            [Key, Display(Name = "ID")]
            [ScaffoldColumn(false)]
            public int StudentID { get; set; }
    
            [Required, StringLength(40), Display(Name="Last Name")]
            public string LastName { get; set; }
    
            [Required, StringLength(20), Display(Name = "First Name")]
            public string FirstName { get; set; }
    
            [EnumDataType(typeof(AcademicYear)), Display(Name = "Academic Year")]
            public AcademicYear Year { get; set; }
    
            public virtual ICollection<Enrollment> Enrollments { get; set; }
        }
    
        public class Enrollment
        {
            [Key]
            public int EnrollmentID { get; set; }
            public int CourseID { get; set; }
            public int StudentID { get; set; }
            public decimal? Grade { get; set; }
            public virtual Course Course { get; set; }
            public virtual Student Student { get; set; }
        }
    
        public class Course
        {
            [Key]
            public int CourseID { get; set; }
            public string Title { get; set; }
            public int Credits { get; set; }
            public virtual ICollection<Enrollment> Enrollments { get; set; }
        } 
    
        public enum AcademicYear
        {
            Freshman,
            Sophomore,
            Junior,
            Senior
        }
    }
    

    SchoolContext sınıfı, veritabanı bağlantısını yöneten ve verilerdeki değişiklikleri yapan öğesinden DbContexttüretilir.

    Student sınıfında , FirstNameve LastName özelliklerine Yearuygulanan özniteliklere dikkat edin. Bu öğreticide veri doğrulaması için bu öznitelikler kullanılır. Kodu basitleştirmek için yalnızca bu özellikler veri doğrulama öznitelikleriyle işaretlenir. Gerçek bir projede doğrulamaya ihtiyaç duyan tüm özelliklere doğrulama öznitelikleri uygularsınız.

  4. UniversityModels.cs kaydedin.

Veritabanını sınıflara göre ayarlama

Bu öğreticide, nesneleri ve veritabanı tablolarını oluşturmak için Code First Migrations kullanılır. Bu tablolarda öğrenciler ve dersleriyle ilgili bilgiler depolar.

  1. Araçlar

  2. Paket Yöneticisi Konsolu'nda şu komutu çalıştırın:
    enable-migrations -ContextTypeName ContosoUniversityModelBinding.Models.SchoolContext

    Komut başarıyla tamamlanırsa, geçişlerin etkinleştirildiğini belirten bir ileti görüntülenir.

    geçişleri etkinleştirme

    Configuration.cs adlı bir dosyanın oluşturulduğuna dikkat edin. sınıfı, Configuration veritabanı tablolarını test verileriyle önceden doldurabilen bir Seed yöntemine sahiptir.

Veritabanını önceden doldurma

  1. Configuration.cs'i açın.

  2. Aşağıdaki kodu Seed metoduna ekleyin. Ayrıca, using adı alanı için bir ContosoUniversityModelBinding. Models deyim ekleyin.

    namespace ContosoUniversityModelBinding.Migrations
    {
        using System;
        using System.Data.Entity;
        using System.Data.Entity.Migrations;
        using System.Linq;
        using ContosoUniversityModelBinding.Models;
    
        internal sealed class Configuration : DbMigrationsConfiguration<SchoolContext>
        {
            public Configuration()
            {
                AutomaticMigrationsEnabled = false;
            }
    
            protected override void Seed(SchoolContext context)
            {
    
                context.Students.AddOrUpdate(
                     new Student { 
                         FirstName = "Carson", 
                         LastName = "Alexander", 
                         Year = AcademicYear.Freshman },
                     new Student { 
                         FirstName = "Meredith", 
                         LastName = "Alonso", 
                         Year = AcademicYear.Freshman },
                     new Student { 
                         FirstName = "Arturo", 
                         LastName = "Anand", 
                         Year = AcademicYear.Sophomore },
                     new Student { 
                         FirstName = "Gytis", 
                         LastName = "Barzdukas", 
                         Year = AcademicYear.Sophomore },
                     new Student { 
                         FirstName = "Yan", 
                         LastName = "Li", 
                         Year = AcademicYear.Junior },
                     new Student { 
                         FirstName = "Peggy", 
                         LastName = "Justice", 
                         Year = AcademicYear.Junior },
                     new Student { 
                         FirstName = "Laura", 
                         LastName = "Norman", 
                         Year = AcademicYear.Senior },
                     new Student { 
                         FirstName = "Nino", 
                         LastName = "Olivetto", 
                         Year = AcademicYear.Senior }
                     );
    
                context.SaveChanges();
    
                context.Courses.AddOrUpdate(
                    new Course { Title = "Chemistry", Credits = 3 },
                    new Course { Title = "Microeconomics", Credits = 3 },
                    new Course { Title = "Macroeconomics", Credits = 3 },
                    new Course { Title = "Calculus", Credits = 4 },
                    new Course { Title = "Trigonometry", Credits = 4 },
                    new Course { Title = "Composition", Credits = 3 },
                    new Course { Title = "Literature", Credits = 4 }
                    );
    
                context.SaveChanges();
    
                context.Enrollments.AddOrUpdate(
                    new Enrollment { StudentID = 1, CourseID = 1, Grade = 1 },
                    new Enrollment { StudentID = 1, CourseID = 2, Grade = 3 },
                    new Enrollment { StudentID = 1, CourseID = 3, Grade = 1 },
                    new Enrollment { StudentID = 2, CourseID = 4, Grade = 2 },
                    new Enrollment { StudentID = 2, CourseID = 5, Grade = 4 },
                    new Enrollment { StudentID = 2, CourseID = 6, Grade = 4 },
                    new Enrollment { StudentID = 3, CourseID = 1 },
                    new Enrollment { StudentID = 4, CourseID = 1 },
                    new Enrollment { StudentID = 4, CourseID = 2, Grade = 4 },
                    new Enrollment { StudentID = 5, CourseID = 3, Grade = 3 },
                    new Enrollment { StudentID = 6, CourseID = 4 },
                    new Enrollment { StudentID = 7, CourseID = 5, Grade = 2 }
                    );
    
                context.SaveChanges();
            }
        }
    }
    
  3. Configuration.cs kaydedin.

  4. Paket Yöneticisi Konsolu'nda add-migration initial komutunu çalıştırın.

  5. update-database komutunu çalıştırın.

    Bu komutu çalıştırırken bir özel durum alırsanız, StudentID ve CourseID değerleri Seed yöntemi değerlerinden farklı olabilir. Bu veritabanı tablolarını açın ve StudentID ile CourseID için mevcut değerleri bulun. Bu değerleri Enrollments tablosunu tohumlamak için koda ekleyin.

GridView denetimi ekleme

Doldurulmuş veritabanı verileriyle artık bu verileri alıp görüntülemeye hazırsınız.

  1. Students.aspx'i açın.

  2. Yer tutucu MainContent'ü bulun. Bu yer tutucuya bu kodu içeren bir GridView denetimi ekleyin.

    <asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
        <asp:GridView runat="server" ID="studentsGrid"
            ItemType="ContosoUniversityModelBinding.Models.Student" DataKeyNames="StudentID" 
            SelectMethod="studentsGrid_GetData"
            AutoGenerateColumns="false">
            <Columns>
                <asp:DynamicField DataField="StudentID" />
                <asp:DynamicField DataField="LastName" />
                <asp:DynamicField DataField="FirstName" />
                <asp:DynamicField DataField="Year" />          
                <asp:TemplateField HeaderText="Total Credits">
                  <ItemTemplate>
                    <asp:Label Text="<%# Item.Enrollments.Sum(en => en.Course.Credits) %>" 
                        runat="server" />
                  </ItemTemplate>
                </asp:TemplateField>        
            </Columns>
        </asp:GridView>
    </asp:Content>
    

    Dikkate alınacak noktalar:

    • GridView öğesindeki SelectMethod özelliği için ayarlanan değere dikkat edin. Bu değer, sonraki adımda oluşturduğunuz GridView verilerini almak için kullanılan yöntemi belirtir.

    • ItemType özelliği daha önce oluşturulan sınıfa Student ayarlanır. Bu ayar, işaretlemedeki sınıf özelliklerine başvurmanızı sağlar. Örneğin, Student sınıfı Enrollments adlı bir koleksiyona sahiptir. Bu koleksiyonu almak için kullanabilir ve ardından her öğrencinin kayıtlı kredi toplamını almak için LINQ sözdizimini kullanabilirsiniz.

  3. Students.aspx kaydedin.

Verileri almak için kod ekleme

Students.aspx code-behind dosyasına değer SelectMethod için belirtilen metodu ekleyin.

  1. Students.aspx.cs'i açın.

  2. using ve ContosoUniversityModelBinding. Models ad alanları için System.Data.Entity deyimleri ekleyin.

    using ContosoUniversityModelBinding.Models;
    using System.Data.Entity;
    
  3. için SelectMethodbelirttiğiniz yöntemi ekleyin:

    public IQueryable<Student> studentsGrid_GetData()
    {
        SchoolContext db = new SchoolContext();
        var query = db.Students.Include(s => s.Enrollments.Select(e => e.Course));
        return query;
    }
    

    Include yan tümcesi sorgu performansını artırır ancak gerekli değildir. Include yan tümcesi olmadan veriler, ilgili veriler her alındığında veritabanına ayrı bir sorgu göndermeyi içeren gecikmeli yükleme kullanılarak alınır. yan tümcesiyle Include, veriler eager loading kullanılarak alınır ve bu da tek bir veritabanı sorgusunun tüm ilgili verileri aldığı anlamına gelir. İlgili veriler kullanılmıyorsa, daha fazla veri alındığından istekli yükleme daha az verimli olur. Ancak bu durumda, her kayıt için ilgili veriler görüntülendiğinden, istekli yükleme size en iyi performansı verir.

    İlgili verileri yüklerken performansla ilgili dikkat edilmesi gerekenler hakkında daha fazla bilgi için, ASP.NET MVC Uygulamasında Entity Framework ile İlgili Verileri Okuma makalesinin Gecikmeli, Istekli ve Açık Yükleme bölümüne bakın.

    Varsayılan olarak, veriler anahtar olarak işaretlenen özelliğin değerlerine göre sıralanır. Farklı bir OrderBy sıralama değeri belirtmek için bir yan tümce ekleyebilirsiniz. Bu örnekte, sıralama için varsayılan StudentID özellik kullanılır. Sıralama, Sayfalama ve Verileri Filtreleme makalesinde, kullanıcı sıralama için bir sütun seçmek üzere etkinleştirilmiştir.

  4. Students.aspx.cs kaydedin.

Uygulamanızı çalıştırma

Web uygulamanızı (F5) çalıştırın ve öğrenciler sayfasına gidin ve aşağıdakiler görüntülenir:

verileri göster

Model bağlama yöntemlerinin otomatik olarak oluşturulması

Bu öğretici serisinde çalışırken, öğreticideki kodu projenize kopyalamanız yeterlidir. Ancak, bu yaklaşımın bir dezavantajı, Model bağlama yöntemleri için otomatik olarak kod oluşturmak üzere Visual Studio tarafından sağlanan özelliğin farkında olmayabilmektir. Kendi projelerinizde çalışırken, otomatik kod oluşturma size zaman kazandırabilir ve bir işlemin nasıl uygulanabileceği konusunda fikir sahibi olmanıza yardımcı olabilir. Bu bölümde otomatik kod oluşturma özelliği açıklanmaktadır. Bu bölüm yalnızca bilgilendirme amaçlıdır ve projenizde uygulamanız gereken herhangi bir kod içermez.

İşaretlem kodunda SelectMethod, UpdateMethod, InsertMethodveya DeleteMethod özellikleri için bir değer ayarlarken , Yeni Yöntem Oluştur seçeneğini belirleyebilirsiniz.

yöntem oluşturma

Visual Studio yalnızca doğru imzayla arka planda kodda bir yöntem oluşturmakla kalmaz, aynı zamanda işlemi gerçekleştirmek için uygulama kodu da oluşturur. Otomatik kod oluşturma özelliğini kullanmadan önce özelliğini ayarlarsanız ItemType , oluşturulan kod işlemler için bu türü kullanır. Örneğin, özelliği ayarlanırken UpdateMethod aşağıdaki kod otomatik olarak oluşturulur:

// The id parameter name should match the DataKeyNames value set on the control
public void studentsGrid_UpdateItem(int id)
{
    ContosoUniversityModelBinding.Models.Student item = null;
    // Load the item here, e.g. item = MyDataLayer.Find(id);
    if (item == null)
    {
        // The item wasn't found
        ModelState.AddModelError("", String.Format("Item with id {0} was not found", id));
        return;
    }
    TryUpdateModel(item);
    if (ModelState.IsValid)
    {
        // Save changes here, e.g. MyDataLayer.SaveChanges();

    }
}

Bu kodun projenize eklenmesi gerekmez. Sonraki öğreticide, yeni verileri güncelleştirme, silme ve ekleme yöntemlerini uygulayacaksınız.

Özet

Bu öğreticide veri modeli sınıfları oluşturdunuz ve bu sınıflardan bir veritabanı oluşturdunuz. Veritabanı tablolarını test verileriyle doldurdun. Veritabanından veri almak için model bağlama kullandınız ve ardından verileri GridView'da görüntülediniz.

Bu serinin sonraki öğreticisinde verileri güncelleştirme, silme ve oluşturma adımlarını etkinleştireceksiniz.