Mvc Layout İçinde PartialView Yükleme

Posted by

Selam arkadaşlar, bu yazımda Mvc Layout İçinde PartialView Yükleme konusundan bahsedeceğim.

PartialView parçalı görünüm anlamına gelmektedir. Yani partial view ile belli başlı alanlarımızı ayırabiliriz. Örneğin menü için bir partial view oluşturursak bunu layout içinde çağırabiliriz. Böylece menü ile ilgili tüm işlemler o partial view içinde bulunur. Bazı durumlarda layout içindeki bölgelerimizi her sayfada göstermek ihtiyacı duyabiliriz. Örneğin bir blog sitesi düşünürsek, bu sitede sağda veya solda bulunan kısımlar genellikle sabit kalmaktadır ve bu kısımdaki birçok şey veritabanından gelmektedir. Mesela kategori listesi gibi ya da son eklenen yorumlar, son eklenen yazılar gibi…

Layout oluşturduğumuzda bunun bir controller tarafı olmayacağı için Layout içinde belirlediğimiz bir tanımlama ile ilgili Controller’ın ilgili Action’ına git bu listeyi veya değerleri bize getir şeklinde belirtebiliriz. Hemen bir örnek ile göstermek istiyorum:


<!-- Aşağıda bulunan kod örneği layout içinde yazmamız gereken koddur -->

@Html.Action("PartialViewSample", "Home")

Örnek kodda Html.Action() ile partialview çağırılmıştır fakat partial view çağırılma işlemi yani hangi PartialView’in çağırılması işlemi Html.Action() içinde belirttiğimiz HomeController‘da bulunan PartialViewSample isimli action içerisinden gelmektedir.

Controller’da bulunan kodumuz ise aşağıdaki gibidir. Tabii ben burada statik bir liste oluşturdum. Bu listenin bir kaynaktan geldiğini düşündüğümüzde işlemlerimizi ona göre yaptırmalıyız.


public ActionResult PartialViewSample()
{
List<Product> products = new List<Product>() {
new Product(){ ProductId = 1, ProductName = "Asus", ProductPrice = 3500 },
new Product(){ ProductId = 2, ProductName = "Acer", ProductPrice = 2500 }
};

return PartialView("PartialViewSample",products);
}

Modelimizi de aşağıdaki gibi oluşturuyoruz.


public class Product
{
public int ProductId { get; set; }
public string ProductName { get; set; }
public decimal ProductPrice { get; set; }
}

PartialView kodumuz ise aşağıdaki gibidir:


@model List<PartialViewSample.Models.Product>

<ul class="list-group">
@foreach (var p in Model)
{
<li class="list-group-item">
@p.ProductName
</li>
}
</ul>

Yukarıdaki gibi dosyalarımızı oluşturup ilgili kodları yazdığınızda artık bu partial view render edilerek layout dosyasında ilgili yerde gösterilecektir. PartialView kullanımını bu şekilde sağlayabilirsiniz.

Bir sonraki yazıda görüşmek üzere…

3 comments

Leave a Reply

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir