Asp.Net Mvc – Controller ve View İşlemleri 3 (Asp.Net Mvc Yazı Dizisi – 15)
Önceki Yazı : Asp.Net Mvc – Controller ve View İşlemleri 2 (Asp.Net Mvc Yazı Dizisi – 14)
Merhaba Arkadaşlar,
Geliştirmesini aktif bir şekilde sürdürdüğümüz, blog projesinde, önceki dersimizde, ana sayfada son beş makaleyi Partial View şeklinde listelemiştik. Bugün ise ana sayfamızın içeriğini doldurmaya devam edeceğiz.
Ana sayfamızda kullanacaklarımız;
- Son 5 makalenin ana sayfada listelenmesi (Yapıldı)
- Son 5 yorumun ana sayfada listelenmesi
- En çok kullanılan 10 etiketin ana sayfada listelenmesi
Görüldüğü gibi ana sayfaya, yorumlar ve etiketler eklenecektir. Hemen bloğumuzu geliştirmeye devam edelim.
Önceki makalelerimizde, yapılan işlemleri çok detaylı şekilde izah etmeye çalıştım. Bundan sonraki süreçte, aynı kısımları tekrar anlatmayacağım. Takıldığınız yerlerde, lütfen önceki makalelerimizi inceleyiniz.
- Projemizi açalım. (Son halini indirmek için tıklayınız.)
- Öncelikle son 5 yorum listesini hazırlayacağız.
- Controllers>HomeController.cshtml dosyasını açalım.
- İçerisine aşağıda kodları verilen SonBesYorum Action'umuzu ekleyelim.
//Son 5 yorumun ana sayfaya yükleneceği Action
public ActionResult SonBesYorum()
{
MvcProjesiContext db = new MvcProjesiContext();
//Tarih sırasına göre son makaleleri OrderByDescending ile çekip Take ile de 5 tane almasını istiyoruz.
List<Yorum> yorumListe = db.Yorums.OrderByDescending(i => i.Tarih).Take(5).ToList();
//Ayrıca yorumListe nesnesini de View'de kullanacağımız şekilde model olarak aktarıyoruz.
return PartialView(yorumListe);
}
- Şimdi Action'umuzun View'ini oluşturalım. Bunun için
public ActionResult SonBesYorum()satırında,SonBesYorum()kısmının üzerine sağ tıklayarak, Add View diyelim. - Çıkan ekranda, içeriği aşağıdaki resimdeki gibi doldurup Add tuşuna basalım.
- Şimdi, açılan View dosyamızın içini, aşağıdaki gibi yeniden düzenleyelim.
<!--Modelimiz liste olarak geldiği için List<> içerisine aldık-->
@model List<MvcProjesi.Data.Yorum>
<div style="border:1px solid red;padding:25px;text-align:center;">
<h2>Son Beş Yorum</h2>
@{
//Bu sefer de for döngüsünü kullandık.
for (int i = 0; i < Model.Count() - 1; i++)
{
//Burada her yorumun etrafına çerçeve attık
<div style="border:1px solid red">
<!--Üye bilgilerini alırken Linq yardımıyla, direkt, yorumu yazan üyenin bilgilerine
@@Model[i].Uye. şeklinde ulaşabildik.
-->
<h3>Üye Bilgileri</h3>
Adı : @Model[i].Uye.Ad<br />
Soyadı : @Model[i].Uye.Soyad<br />
<h3>Makale Bilgileri</h3>
<!--Üye bilgilerini alırken Linq yardımıyla, direkt, yorumun ait olduğu
makelenin bilgilerine @@Model[i].Makale. şeklinde ulaşabildik.
-->
Başlık : @Model[i].Makale.Baslik
<h3>Yorumun İçeriği</h3>
<p>@Model[i].Icerik</p>
Tarih : @Model[i].Tarih
</div>
}
}
</div>
- İçeriğimizi, ana sayfamızda göstereceğimiz için, ana sayfamızda SonBesYorum Partial View'imizi konumlandırmamız gerekecek. Bunun için Views>Home>Index.cshtml dosyamızı açalım.
- İçeriğini ise aşağıdaki gibi güncelleyelim.
@{
ViewBag.Title = "Index";
}
<!--Bu div, bizim ana içeriğimiz. Genişliğin, %75'ini almasını ve sola yaslanmasını istedik. -->
<div style="width:75%;float:left">
<!--Burada Partial View yerine Html.Action metodunu çağırdık-->
@Html.Action("SonBesMakale")
</div>
<!--Bu div, bizim yan kenar içeriğimiz. Genişliğin, %25'ini almasını ve sola,
ana divin yanına, yaslanmasını istedik. -->
<div style="width:25%;float:left">
@Html.Action("SonBesYorum")
</div>
- Görüldüğü gibi içeriğimizi, ikiye böldük ve yerleşimlerini ayarladık. Ayrıca SonBesYorum Partial View'ini de çağırdık. Şimdi projemizi çalıştıralım.
Görüleceği üzere, Son Beş Yorum başlığının altında, herhangi bir yorum gelmedi. Bunun sebebi sistemde henüz herhangi bir yorum yapılmamış olmasıdır. Biz geçici olarak, kodla örnek yorumlar ekleyeceğiz.
- Global.asax dosyamızı açalım. İçeriğini aşağıdaki gibi güncelleyelim.
//Veritabanı context sınıfımızı referans veriyoruz
using MvcProjesi.Data;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Optimization;
using System.Web.Routing;
namespace MvcProjesi
{
public class MvcApplication : System.Web.HttpApplication
{
//Uygulama ilk başlatıldığında, buradaki metod çalışacak.
protected void Application_Start()
{
//Burada veritabanı sınıfımızdan, bir nesne oluşturuyoruz. using kullanmamızın sebebi,
//db nesnesinin işi bittiğinde, silinmesini ve hafızada yer tutmamasını sağlamak.
using (MvcProjesiContext db = new MvcProjesiContext())
{
//Bu metod, eğer veritabanımız oluşturulmamış ise, oluşturulmasını sağlıyor.
db.Database.CreateIfNotExists();
//Veritabanındaki makalelerin,yorumların ve üyelerin adetini alıyoruz.
int makaleAdet = (from i in db.Makales select i).Count();
int yorumAdet = (from i in db.Yorums select i).Count();
int uyeAdet = (from i in db.Uyes select i).Count();
//Veritabanına, sürekli aynı makalelerin ve yorumların eklenmemesi için
//en az 5 adet makale ve yorum var mı diye kontrol ediyoruz.
//Ayrıca sistemde en az 1 üye olduğunu da onaylıyoruz.
if (makaleAdet < 5 || yorumAdet < 5 || uyeAdet < 1)
{
//Bir tane örnek üye oluşturuyoruz.
Uye uye = new Uye() { Ad = "Abdurrahman", Soyad = "Güngör", EPosta = "[email protected]", ResimYol = "", UyeOlmaTarih = DateTime.Now, WebSite = "" };
db.Uyes.Add(uye);
//Makalelerimizi oluşturuyoruz. Ayrıca makalelerin, yukarıda oluşturduğumuz kullanıcı
//tarafından oluşturulduğunu gösteriyoruz.
Makale makale1 = new Makale() { Baslik = "Makale Başlığı 1", Icerik = "Makale İçeriği 1", Tarih = DateTime.Now, Uye = uye };
Makale makale2 = new Makale() { Baslik = "Makale Başlığı 2", Icerik = "Makale İçeriği 2", Tarih = DateTime.Now, Uye = uye };
Makale makale3 = new Makale() { Baslik = "Makale Başlığı 3", Icerik = "Makale İçeriği 3", Tarih = DateTime.Now, Uye = uye };
Makale makale4 = new Makale() { Baslik = "Makale Başlığı 4", Icerik = "Makale İçeriği 4", Tarih = DateTime.Now, Uye = uye };
Makale makale5 = new Makale() { Baslik = "Makale Başlığı 5", Icerik = "Makale İçeriği 5", Tarih = DateTime.Now, Uye = uye };
Makale makale6 = new Makale() { Baslik = "Makale Başlığı 6", Icerik = "Makale İçeriği 6", Tarih = DateTime.Now, Uye = uye };
//Makaleleri eklemek için komutumuzu veriyoruz.
//SaveChanges() komutu gelene kadar veritabanına kayıt yapılmayacak.
db.Makales.Add(makale1);
db.Makales.Add(makale2);
db.Makales.Add(makale3);
db.Makales.Add(makale4);
db.Makales.Add(makale5);
db.Makales.Add(makale6);
//Yorumlarımızı oluşturuyoruz. Ayrıca yorumların, yukarıda oluşturduğumuz kullanıcı
//tarafından oluşturulduğunu gösteriyor, ayrıca makalelerimize de bağlıyoruz.
Yorum yorum1 = new Yorum() { Icerik = "Makale 1 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
Yorum yorum2 = new Yorum() { Icerik = "Makale 2 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
Yorum yorum3 = new Yorum() { Icerik = "Makale 3 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
Yorum yorum4 = new Yorum() { Icerik = "Makale 4 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
Yorum yorum5 = new Yorum() { Icerik = "Makale 5 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
Yorum yorum6 = new Yorum() { Icerik = "Makale 6 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
//Yorumları eklemek için komutumuzu veriyoruz.
//SaveChanges() komutu gelene kadar veritabanına kayıt yapılmayacak.
db.Yorums.Add(yorum1);
db.Yorums.Add(yorum2);
db.Yorums.Add(yorum3);
db.Yorums.Add(yorum4);
db.Yorums.Add(yorum5);
db.Yorums.Add(yorum6);
//Son olarak da yaptığımız eklemelerin, veritabanına yansıtılmasını
//sağlamak için kaydet komutu veriyoruz.
db.SaveChanges();
}
}
AreaRegistration.RegisterAllAreas();
FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
RouteConfig.RegisterRoutes(RouteTable.Routes);
BundleConfig.RegisterBundles(BundleTable.Bundles);
}
}
}
- Şimdi projemizi yeniden çalıştırıyoruz. Aşağıdakine benzer bir görüntü alacağız.
Burada, özellikle vurgulamak istediğim bir nokta var. Sisteme bir makale eklerken, öncelikle kullanıcıyı eklediğimize emin olmalıyız. Yoksa makaleyi ekleyen üye bilgisi, boş çıkacaktır. Aynı şekilde, yorumu eklerken de, makalenin önceden eklenmiş olduğuna dikkat etmeliyiz. Bu sistem zaten panel de, düzenli bir şekilde işletiliyor olmalıdır. Dikkat ederseniz, önce kullanıcıyı ekledik (
db.Uyes.Add(uye)), ardından makaleleri ekledik (db.Makales.Add(makale...)), en son da, yorumlarımızı ekledik (db.Yorums.Add(yorum..)). Bu eklemelerin sırası, Entity Framework tarafından sıraya alınmakta, ardındandb.SaveChanges()metodunu çağırdığımızda, belirtilen sıraya göre içerikler eklenmektedir.
Şimdi de hızlıca, ana sayfada ki gereksinimlerimize tekrardan göz atalım.
- Son 5 makalenin ana sayfada listelenmesi (Yapıldı)
- Son 5 yorumun ana sayfada listelenmesi (Yapıldı)
- En çok kullanılan 10 etiketin ana sayfada listelenmesi
Görüldüğü üzere, en çok kullanılan 10 etiketi göstereceğiz.
- Öncelikle, sisteme etiketlerimizi eklemek için, Global.asax dosyamızı açalım ve içeriğini yeniden aşağıdaki gibi düzenleyelim.
//Veritabanı context sınıfımızı referans veriyoruz
using MvcProjesi.Data;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Optimization;
using System.Web.Routing;
namespace MvcProjesi
{
public class MvcApplication : System.Web.HttpApplication
{
//Uygulama ilk başlatıldığında, buradaki metod çalışacak.
protected void Application_Start()
{
//Burada veritabanı sınıfımızdan, bir nesne oluşturuyoruz. using kullanmamızın sebebi,
//db nesnesinin işi bittiğinde, silinmesini ve hafızada yer tutmamasını sağlamak.
using (MvcProjesiContext db = new MvcProjesiContext())
{
//Bu metod, eğer veritabanımız oluşturulmamış ise, oluşturulmasını sağlıyor.
db.Database.CreateIfNotExists();
//Veritabanındaki makalelerin, yorumların, üyelerin ve etiketlerin adetini alıyoruz.
int makaleAdet = (from i in db.Makales select i).Count();
int yorumAdet = (from i in db.Yorums select i).Count();
int uyeAdet = (from i in db.Uyes select i).Count();
int etiketAdet = (from i in db.Etikets select i).Count();
//Veritabanına, sürekli aynı makalelerin ve yorumların eklenmemesi için
//en az 5 adet makale ve yorum var mı diye kontrol ediyoruz.
//Ayrıca sistemde en az 1 üye olduğunu da onaylıyoruz.
//Bununla birlikte en az 10 adet etiket olduğunu da onaylıyoruz.
if (makaleAdet < 5 || yorumAdet < 5 || uyeAdet < 1 || etiketAdet < 10)
{
//Bir tane örnek üye oluşturuyoruz.
Uye uye = new Uye() { Ad = "Abdurrahman", Soyad = "Güngör", EPosta = "[email protected]", ResimYol = "", UyeOlmaTarih = DateTime.Now, WebSite = "" };
db.Uyes.Add(uye);
//Makalelerimizi oluşturuyoruz. Ayrıca makalelerin, yukarıda oluşturduğumuz kullanıcı
//tarafından oluşturulduğunu gösteriyoruz.
Makale makale1 = new Makale() { Baslik = "Makale Başlığı 1", Icerik = "Makale İçeriği 1", Tarih = DateTime.Now, Uye = uye };
Makale makale2 = new Makale() { Baslik = "Makale Başlığı 2", Icerik = "Makale İçeriği 2", Tarih = DateTime.Now, Uye = uye };
Makale makale3 = new Makale() { Baslik = "Makale Başlığı 3", Icerik = "Makale İçeriği 3", Tarih = DateTime.Now, Uye = uye };
Makale makale4 = new Makale() { Baslik = "Makale Başlığı 4", Icerik = "Makale İçeriği 4", Tarih = DateTime.Now, Uye = uye };
Makale makale5 = new Makale() { Baslik = "Makale Başlığı 5", Icerik = "Makale İçeriği 5", Tarih = DateTime.Now, Uye = uye };
Makale makale6 = new Makale() { Baslik = "Makale Başlığı 6", Icerik = "Makale İçeriği 6", Tarih = DateTime.Now, Uye = uye };
//Makaleleri eklemek için komutumuzu veriyoruz.
//SaveChanges() komutu gelene kadar veritabanına kayıt yapılmayacak.
db.Makales.Add(makale1);
db.Makales.Add(makale2);
db.Makales.Add(makale3);
db.Makales.Add(makale4);
db.Makales.Add(makale5);
db.Makales.Add(makale6);
//Yorumlarımızı oluşturuyoruz. Ayrıca yorumların, yukarıda oluşturduğumuz kullanıcı
//tarafından oluşturulduğunu gösteriyor, ayrıca makalelerimize de bağlıyoruz.
Yorum yorum1 = new Yorum() { Icerik = "Makale 1 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
Yorum yorum2 = new Yorum() { Icerik = "Makale 2 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
Yorum yorum3 = new Yorum() { Icerik = "Makale 3 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
Yorum yorum4 = new Yorum() { Icerik = "Makale 4 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
Yorum yorum5 = new Yorum() { Icerik = "Makale 5 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
Yorum yorum6 = new Yorum() { Icerik = "Makale 6 için yazılan yorum", Tarih = DateTime.Now, Makale = makale1, Uye = uye };
//Yorumları eklemek için komutumuzu veriyoruz.
//SaveChanges() komutu gelene kadar veritabanına kayıt yapılmayacak.
db.Yorums.Add(yorum1);
db.Yorums.Add(yorum2);
db.Yorums.Add(yorum3);
db.Yorums.Add(yorum4);
db.Yorums.Add(yorum5);
db.Yorums.Add(yorum6);
//Etiketlerimizi oluşturuyoruz. Ayrıca etiketleri, kullanıldığı makalelerimize de bağlıyoruz.
Etiket etiket1 = new Etiket() { Icerik = "Asp.Net", Makales = new List<Makale>() { makale1, makale2, makale3, makale4, makale6 } };
Etiket etiket2 = new Etiket() { Icerik = "PHP", Makales = new List<Makale>() { makale5, makale3, makale2, makale1 } };
Etiket etiket3 = new Etiket() { Icerik = "Java", Makales = new List<Makale>() { makale2, makale4, makale5 } };
Etiket etiket4 = new Etiket() { Icerik = "C#", Makales = new List<Makale>() { makale5, makale4 } };
Etiket etiket5 = new Etiket() { Icerik = "Ruby", Makales = new List<Makale>() { makale5, makale6 } };
Etiket etiket6 = new Etiket() { Icerik = "C++", Makales = new List<Makale>() { makale5, makale2 } };
Etiket etiket7 = new Etiket() { Icerik = "D", Makales = new List<Makale>() { makale5, makale1 } };
Etiket etiket8 = new Etiket() { Icerik = "Phyton", Makales = new List<Makale>() { makale1, makale4 } };
Etiket etiket9 = new Etiket() { Icerik = "JSF", Makales = new List<Makale>() { makale5, makale4 } };
Etiket etiket10 = new Etiket() { Icerik = "JSP", Makales = new List<Makale>() { makale5, makale3, makale6 } };
Etiket etiket11 = new Etiket() { Icerik = "XCode", Makales = new List<Makale>() { makale5, makale4, makale1 } };
Etiket etiket12 = new Etiket() { Icerik = "ColdFusion", Makales = new List<Makale>() { makale5, makale2 } };
Etiket etiket13 = new Etiket() { Icerik = "Pascal", Makales = new List<Makale>() { makale5, makale1, makale3 } };
Etiket etiket14 = new Etiket() { Icerik = "Cobol", Makales = new List<Makale>() { makale5, makale4, makale3, makale1, makale2 } };
//Etiketleri eklemek için komutumuzu veriyoruz.
//SaveChanges() komutu gelene kadar veritabanına kayıt yapılmayacak.
db.Etikets.Add(etiket1);
db.Etikets.Add(etiket2);
db.Etikets.Add(etiket3);
db.Etikets.Add(etiket4);
db.Etikets.Add(etiket5);
db.Etikets.Add(etiket6);
db.Etikets.Add(etiket7);
db.Etikets.Add(etiket8);
db.Etikets.Add(etiket9);
db.Etikets.Add(etiket10);
db.Etikets.Add(etiket11);
db.Etikets.Add(etiket12);
db.Etikets.Add(etiket13);
db.Etikets.Add(etiket14);
//Son olarak da yaptığımız eklemelerin, veritabanına yansıtılmasını
//sağlamak için kaydet komutu veriyoruz.
db.SaveChanges();
}
}
AreaRegistration.RegisterAllAreas();
FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
RouteConfig.RegisterRoutes(RouteTable.Routes);
BundleConfig.RegisterBundles(BundleTable.Bundles);
}
}
}
- Şimdi, Controllers>HomeController.cs dosyamızı açalım ve içerisine EnCokOnEtiket Action'umuzu aşağıdaki kodlarla ekleyelim.
//En çok kullanılan 5 etiketin ana sayfaya yükleneceği Action
public ActionResult EnCokOnEtiket()
{
MvcProjesiContext db = new MvcProjesiContext();
//Etiketleri sorgularken, kaç adet makaleye bağlandığını bulup, ona göre yüksekten,
//aşağı doğru sıralanmasını sağlıyoruz. Gelen sonuçtan 10 adet alıp, listeye ekliyoruz.
List<Etiket> etiketListe = (from i in db.Etikets orderby i.Makales.Count() descending select i).Take(10).ToList();
//Ayrıca etiketListe nesnesini de View'de kullanacağımız şekilde model olarak aktarıyoruz.
return PartialView(etiketListe);
}
- Ardından,
EnCokOnEtiket()kısmına sağ tıklayıp, Add View diyelim. - Çıkan ekranda, içeriği aşağıdaki resimdeki gibi doldurup Add tuşuna tıklayalım.
- Açılan View'imizin de içeriğini aşağıdaki gibi dolduralım.
<!--Modelimiz liste olarak geldiği için List<> içerisine aldık-->
@model List<MvcProjesi.Data.Etiket>
<div style="border:1px solid yellow;padding:25px;text-align:center;">
<h2>En Çok Kullanılan On Etiket</h2>
@{
//Bu sefer de while döngüsünü kullandık.
int sayi = 0;
while (sayi < Model.Count())
{
//Burada her etiketin etrafına çerçeve attık
<ul style="border:1px solid yellow">
<li>@Model[sayi].Icerik</li>
</ul>
sayi++;
}
}
</div>
- En son olarak da, Index sayfamıza, EnCokOnEtiket Partial View'imizi ekleyelim.
- Views>Home>Index.cshtml dosyamızı açalım ve içeriğini aşağıdaki gibi düzenleyelim.
@{
ViewBag.Title = "Index";
}
<!--Bu div, bizim ana içeriğimiz. Genişliğin, %75'ini almasını ve sola yaslanmasını istedik. -->
<div style="width:75%;float:left">
<!--Burada Partial View yerine Html.Action metodunu çağırdık-->
@Html.Action("SonBesMakale")
</div>
<!--Bu div, bizim yan kenar içeriğimiz. Genişliğin, %25'ini almasını ve sola,
ana divin yanına, yaslanmasını istedik. -->
<div style="width:25%;float:left">
@Html.Action("SonBesYorum")
@Html.Action("EnCokOnEtiket")
</div>
Önceki projelerimizde kullandığımız veritabanına, çeşitli kayıtlar eklemiştik. Yeni temiz bir veritabanımız olması için, veritabanı Connection String'imizi değiştirmemiz faydalı olacaktır.
- Ana dizindeki web.config dosyasını açalım. İçerisindeki
<connectionStrings>...</connectionStrings>kısmını
<connectionStrings>
<add name="MvcProjesiContext" connectionString="Data Source=(localdb)\\v11.0;Initial Catalog=MvcProjesiYeni;Integrated Security=True" providerName="System.Data.SqlClient" />
</connectionStrings>
olarak değiştirelim.
- Projemizi çalıştıralım. Aşağıda da görüleceği üzere, sayfanın alt kısmında, en çok kullandığımız 10 etiket te listelendi.
Böylelikle ana sayfamızı da bitirmiş olduk.
Farkedeceğiniz üzere, pek çok farklı yöntemler deneyerek ilerliyoruz. Bu kafa karışıklığı oluşturabilir. Ancak farklı yöntemlerle ilerlemenin ve adım adım ilerlemenin, öğrenme eğrisine katkısı olacağını düşünüyorum.
Önceki yazılarımda, Etiket sınıfında EtiketId'nin tipini yanlışlıkla string olarak tanımlamışım. Normalde bu verinin int olması gerekmektedir. Önceki yazılarımı ve proje dosyalarımı düzelterek bu hatayı giderdim. Ancak daha önceden dosyayı indirip te hata alıyorsanız, lütfen bahsettiğim kısmı kontrol ediniz.
Bir yazımızın daha sonuna geldik. Sonraki dersimizde, makaleler sayfamızı oluşturuyor olacağız.
Projenin son halini buradan indirebilirsiniz.
Hepinize kolaylıklar diliyorum.