MVC'de RenderSection Metodu

13.07.2014

Merhaba arkadaşlar bu yazımda Asp.NET MVC’de RenderSection metotunu anlatacağım. RenderSection metodu bir sayfa içine harici bir veri ekleyebilmemizi sağlar, yani Layout'daki sabit bir alana sayfaya göre özel veri çekmemize yarar. Örnek uygulamamıza geçelim. Önceki derslerde bahsettiğimiz için Asp.NET MCV’de Empty şablonunda nasıl proje oluştururuz anlatmayacağım. Projemizi oluşturduktan sonra Bir layout, index ve AboutUs sayfalarını oluşturuyorum ve bu iki sayfayı layout’a bağlıyorum. Örnekte Layout sayfamdaki header sectionu var ve bu sectionun içeriği sayfalara göre değişiklik gösteriyor.Sırasıyla oluşturduğum sayfaların kodları aşağıdaki gibidir; Layout.cshtml

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title</title>
</head>
<body>
    <div id="conteiner">
        <div id="nav">
            @RenderSection("header")
        </div>
         
        <div id="content">
        @RenderBody()
        </div>
    </div>
</body>
</html>

Index.cshtml

@{
    ViewBag.Title = "ekremozer.com";
    Layout = "~/Views/Shared/Layout.cshtml";
}
 
<h2>www.ekremozer.com | RenderSection Metodu</h2>
 
@section header{
    <a href="/AboutUs/AboutUs">Hakkımda</a>
}

AboutUs.cshtml

@{
    ViewBag.Title = "Hakkımda";
    Layout = "~/Views/Shared/Layout.cshtml";
}
 
<h2>Hakkımda</h2>
 
@section header{
    <a href="/">Ana Sayfa</a>
}

Kodlara baktığımız zamanda kolayca anlayabileceğimiz bir yapı. Index sayfasının içerisinde diyoruz ki header sectionunda bu içerik çıksın, aynısını AboutUs içinde yapıyoruz. Ana sayfadayken Hakkımda sayfasına link veriyorum, Hakkımda sayfasında iken de Ana sayfaya. Örnek kodların ardından bir kaç olasılığa değinmek istiyorum. Örneğin Index ve AboutUs da sectionlarımızın içeriğini belirledik ama Layout sayfamızda @RenderSection("header") ile sectionumuzu çağırmadık, bunun neticesinde sitemiz çalışmaz ve "Section not defined: "header". gibi bir hata verir. Bunu önlemenin iki yolu var RenderSection kodumuzu aşağıdaki gibi düzenlersek eğer;

<div id="nav">
     @RenderSection("header" ,false)
 </div>

False değeri verdiğimiz için sectionumuz yoksa uygulama çalışmaya devam edecek ancak nav kısmı haliyle boş kalacaktır. İkinci bir yöntem ise IsSectionDefiden metodu ile sectionumuz var mı yok mu kontrol etmek. Bu da şu şekilde olmaktadır.

<div id="nav">
 @if (IsSectionDefined("header"))
 {
   @RenderSection("header")
 }
</div>

Yukarıdaki kodda if koşulu sağlandığı taktirde yani section varsa getirecektir, koşul sağlanmazsa o kısma yokmuş gibi davranacaktır. Bu dersimizde kısaca RenderSection mantığından bahsetmeye çalıştım, umarım faydalı olmuştur. Örnek projeyi indirmek için tıklayınız.