Model View Controller (MVC), kullanıcıya yüklü miktarda verinin sunulduğu karmaşık uygulamalarda veri ve gösterimin soyutlanması esasına dayanır. Böylelikle veriler (model) ve kullanıcı arayüzü (view) birbirini etkilemeden düzenlenebilir. Model-view-controller, bunu controller adı verilen ara bileşenle, veri gösterimi ve kullanıcı etkileşiminden, veri erişimi ve iş mantığını çıkarma suretiyle çözmektedir.

Bir MVC uygulaması gerçekleştirebilmek için bilgisayarımızda Visual Studio 2008 SP1 yüklü olması gereklidir. MVC Framework için ise bu linkten gerekli güncel dosyayı indirip yükleyebilirsiniz.

Projede kullanacağımız veri tabanını aşağıdaki şekildeki gibi oluşturduk.

4

Tablonun Identity Column (Kimlik Sütunu) özelliğine Id değerini atadık.

5

Daha sonrasında da denemeler yapabilmek için elimizle birkaç veri girdik.

13

File->New Project adımlarından sonra açılan pencereden ASP.NET MVC Web Application seçerek projemiz oluşturulur.

1

Bir sonraki adımda bize test projesi isteyip istemediğimizi soracak olan pencere geldi karşımıza. Burada test projesi istemediğimizi seçtik. (Visual Web Developer sürümlerinde bu pencere bizim karşımıza çıkmayacaktır.)

2

Böylece projemizin ilk halini yaratmış olduk.

MVC Framework’ün bize sağladığı kayıt listeleme, yeni kayıt oluşturma ve kayıt düzenleme özelliklerini daha rahat görebilmek için Controllers\HomeController.cs dosyasını ve Views\Home dizinini daha sonra tekrar yaratmak üzere sildik.

MVC projemizi gerçekleyebilmek için bir veritabanı bağlantısına modelini oluşturmak için ADO.NET Entity Data Model kullandık. Bu modeli ekleyebilmek için Solution Explorer’daki Models klasörü üstünde sağ tıklayarak Add New Item seçeneğini seçtik.

6

Karşımıza çıkan ekranlarda sırasıyla;

  • Generate From Database
  • Choose Your Data Connection ekranında veri tabanını seçiyoruz.
  • Choose Your Database Object ekranında table seçeneğinden kullanacak olduğumuz Araba tablomuzu seçerek işlemimizi tamamladık.

Sonuçta Models dizini altında NorthwindModel.edmx adında bir dosya oluştu. Modelimizin Column Mapping (Sütun haritalandırma) bölümünde tablomuza karşılık gelen tablo aşağıda olduğu gibi otomatik olarak oluştu.

7

8 

Bu sayede projemize veri tabanı bağlanmış oldu. Bu bağlantımızı MVC kullanarak formlar halinde verilerimiz üzerinde değişiklik yapabileceğiz. MVC kontrollerimizi ekleyebilmek için Solution Explorer’da Controllers klasörünün üzerinde sağ tıklayak Add->Controller adımlarını izleyerek yeni bir sınıf yaratıyoruz.

 10

Daha önce sildiğimiz HomeController adındaki kontrolü tekrardan yarattık. Bu esnada Index, Create, Edit metotları içleri boş şekilde otomatik olarak oluşturuldu.

HomeController sınıfı içinden veri tabanına bağlanabilmek için;

private NorthwindEntities db = new NorthwindEntities();

kod parçacığını ekledik. Daha sonra “db” kullanarak veri tabanından gerekli veri çekme işlemini gerçekleştireceğiz.

Veri tabanımızdaki verilerimizi listeleyebilmek için Index() metodunu kullandık. Bu metot aşağıdaki şekilde değiştirdik.

public ActionResult Index()

        {

            return View(db.Araba.ToList());

        }

Metodun ismi üzerinde sağ tıklayarak Add View seçeneğini seçtik. Açılan ekranı aşağıdaki şekildeki gibi doldurduk. Listeleme işlemi yapacağımız için içerik olarak List seçeneğini seçtik.

12

Bu sayede Views/Home dizini altında listeleme yapılacak Index.aspx sayfasını otomatik olarak oluşturuldu. Oluşturulan sayfa içerisindeki kodların hiç birinde değişiklik yapılmadı. Ekran çıktısı olarak bunu aldık.

14

Yeni kayıt oluşturmak için Create() metodunu ve aşırı yüklenmiş ve sunucu post yolu ile haberleşen Create() metodunu gerçekledik.

public ActionResult Create()

        {

            return View();

        }

 

 

        [AcceptVerbs(HttpVerbs.Post)]

 

        public ActionResult Create([Bind(Exclude="Id")] Araba arabaToCreate)

        {

            if (!ModelState.IsValid)

                return Create();

            try

            {

                db.AddToAraba(arabaToCreate);

                db.SaveChanges();

 

                return RedirectToAction("index");

            }

            catch

            {

                return View();

            }

        }

View oluşturmak için Index() metodunda kullandığımız yöntemi kullanıyoruz. İçerik olarak bu kez Create seçeneğini seçtik.

15

Bu sayede Views/Home dizini altında listeleme yapılacak Create.aspx sayfasını otomatik olarak oluşturuldu. Oluşturulan sayfa içerisindeki kodların hiç birinde değişiklik yapılmadı. Ayrıca otomatik olarak alan kontrolü yapan kontrollerde sayfamıza yerleştirilmiş durumda.

17

Id seçeneğinde uyarı vermemesinin sebebi aşırı yüklenmiş metodu oluştururken Id değerinin otomatik artırılacağı şeklinde ayar yapmamızdı. Bu kutuya herhangi bir değer girilse dahi yeni kayıt için Id değerini en son Id değerinin bir fazlası şeklinde veri tabanına kayıt edilecektir.

Kayıt düzenleme için de Edit() metodunu kullanacağız. Create’de olduğu gibi bir tane normal ve bir tane de aşırı yüklenmiş metodumuz var. Birincisi Id ‘den yararlanarak düzenlenecek olan kayıta ilişkin verileri form kontrollerine bind eder. İkincisi ise form kontrollerine bind edilmiş olan veriler üzerinde yapılmış olan değişiklikleri günceller.

        public ActionResult Edit(int id)

        {

            var arabaToEdit = (from n in db.Araba

                               where n.Id == id

                               select n).First();

 

            return View(arabaToEdit);

        }

 

        [AcceptVerbs(HttpVerbs.Post)]

        public ActionResult Edit(Araba arabaToEdit)

        {

           if (!ModelState.IsValid)

           return View();

           try

           {

              var arabaEdit = (from m in db.Araba

                       where m.Id == arabaToEdit.Id

                       select m).First();

              db.ApplyPropertyChanges(arabaEdit.EntityKey.EntitySetName, arabaToEdit);

              db.SaveChanges();

 

              return RedirectToAction("Index");

            }

            catch

            { return View(); }

        }

 

Diğer metotlarda olduğu gibi View’imizi oluşturduk. İçerik olarak bu kez Edit seçeneğini seçtik.

18

Bu sayede Views/Home dizini altında listeleme yapılacak Edit.aspx sayfasını otomatik olarak oluşturuldu. Oluşturulan sayfa içerisindeki kodların hiç birinde değişiklik yapılmadan aşağıdaki çıktıyı aldık.

19

Tags: , | Categories: .NET