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

Makale
07/13/2023

Bu öğretici serisi, bir ASP.NET Web Forms projesiyle model bağlama kullanmanın temel yönlerini gösterir. Model bağlama, veri etkileşiminin veri kaynağı nesneleriyle (ObjectDataSource veya SqlDataSource gibi) ilgilenmekten daha düz olmasını sağlar. Bu seri tanıtım malzemeleriyle başlar ve sonraki öğreticilerde daha gelişmiş kavramlara geçer.

Model bağlama düzeni herhangi bir veri erişim teknolojisiyle ç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 alma mantığını 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ırsınız. 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 web barındırma hizmeti sunar
ücretsiz Azure deneme hesabı. Visual Studio web projesini Azure App Service Web Apps dağıtma hakkında bilgi için bkz. Visual Studio serisini kullanarak web dağıtımı ASP.NET. Bu öğreticide, SQL Server veritabanınızı Azure SQL Veritabanına dağıtmak için Entity Framework Code First Migrations 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şturacaklarınız

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
Web formunda veri görüntüleme

Proje oluşturma

Visual Studio 2017'de ContosoUniversityModelBinding adlı bir ASP.NET Web Uygulaması (.NET Framework) projesi oluşturun.
Tamam’ı seçin. Şablon seçmek için iletişim kutusu görüntülenir.
Web Forms şablonunu seçin.
Gerekirse, kimlik doğrulamasını Bireysel Kullanıcı Hesapları olarak değiştirin.
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.

Site.Master dosyasını açın.
Başlığı, ASP.NET Uygulamam'ı değil Contoso Üniversitesi'ni görüntüleyecek şekilde değiştirin.
```
<title><%: Page.Title %> - Contoso University</title>
```

Uygulama adı olan üst bilgi metnini Contoso Üniversitesi 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>

Gezinti üst bilgisi bağlantılarını uygun site bağlantıları olarak değiştirin.

Hakkında ve Kişi bağlantılarını kaldırın ve bunun yerine oluşturacağınız Öğrenciler sayfasına bağlanın.
```
<ul class="nav navbar-nav">
    <li><a runat="server" href="~/">Home</a></li>
    <li><a runat="server" href="~/Students">Students</a></li>
</ul>
```
Site.Master dosyasını kaydedin.

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

Çözüm Gezgini'da projenize sağ tıklayın, Ekle'yi ve ardından Yeni Öğe'yi seçin.
Yeni Öğe Ekle iletişim kutusunda, Ana Sayfalı Web Formu şablonunu seçin ve Students.aspx olarak adlandırın.
Add (Ekle) seçeneğini belirleyin.
Web formunun ana sayfası için Site.Master'ı seçin.
Tamam’ı seçin.

Veri modelini ekleme

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

Modeller'e sağ tıklayın, Ekle'yi ve ardından Yeni Öğe'yi seçin. Yeni Öğe Ekle iletişim kutusu görünür.
Sol gezinti menüsünden Kod'a ve ardından Sınıf'a tıklayın.

UniversityModels.cs sınıfını 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 , LastNameve Year özelliklerine FirstNameuygulanan ö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.

UniversityModels.cs dosyasını kaydedin.

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

Bu öğreticide nesneler ve veritabanı tabloları oluşturmak için Code First Migrations kullanılır. Bu tablolarda öğrenciler ve kurslarıyla ilgili bilgiler depolar.

Araçlar>NuGet Paket Yöneticisi>Paket Yöneticisi Konsolu'nu seçin.
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.

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

Configuration.cs dosyasını açın.

Seed yöntemine aşağıdaki kodu ekleyin. Ayrıca ad alanı için ContosoUniversityModelBinding. Models bir using 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();
        }
    }
}

Configuration.cs dosyasını kaydedin.
Paket Yöneticisi Konsolu'nda add-migration initial komutunu çalıştırın.
update-database komutunu çalıştırın.

Bu komutu çalıştırırken bir özel durum alırsanız ve StudentIDCourseID değerleri yöntem değerlerinden Seed farklı olabilir. Bu veritabanı tablolarını açın ve ve CourseIDiçin StudentID mevcut değerleri bulun. Bu değerleri, tablonun dengeli şekilde dağıtılması için koda Enrollments ekleyin.

GridView denetimi ekleme

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

Students.aspx dosyasını açın.

Yer tutucuyu 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 akacak 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, sınıfı adlı StudentEnrollmentsbir koleksiyona sahiptir. Bu koleksiyonu almak için kullanabilir Item.Enrollments ve sonra linq söz diziminde her öğrencinin kayıtlı kredi toplamını alabilirsiniz.

Students.aspx dosyasını kaydedin.

Verileri almak için kod ekleme

Students.aspx arka planda kod dosyasına değer için SelectMethod belirtilen yöntemi ekleyin.

Students.aspx.cs dosyasını açın.
ve System.Data.Entity ad alanları için ContosoUniversityModelBinding. Models deyimleri ekleyinusing.
```
using ContosoUniversityModelBinding.Models;
using System.Data.Entity;
```
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ümcesi Include ile veriler, tek bir veritabanı sorgusunun tüm ilgili verileri aldığı anlamına gelen istekli yükleme kullanılarak alınır. İ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ı sağlar.

İlgili verileri yüklerken performansla ilgili dikkat edilmesi gerekenler hakkında daha fazla bilgi için, bir ASP.NET MVC Uygulaması'nda Varlık Çerçevesi 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.
Students.aspx.cs dosyasını 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 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ği fark etmeyebilmektir. Kendi projelerinizde çalışırken, otomatik kod oluşturma size zaman kazandırabilir ve bir işlemi nasıl uygulayabileceğiniz hakkında fikir edinmenize 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 bir yöntem oluşturmakla kalmaz, aynı zamanda işlemi gerçekleştirmek için uygulama kodu da oluşturur. Özelliği otomatik kod oluşturma özelliğini kullanmadan önce 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();

    }
}

Yine 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ğlamayı kullandınız ve ardından verileri GridView'da görüntülediyseniz.

Bu serinin sonraki öğreticisinde verileri güncelleştirmeyi, silmeyi ve oluşturmayı etkinleştireceksiniz.