Veysel Uğur KIZMAZ

Asp.Net MVC 3 User Control İşlemleri

16.06.2012Okunma Sayısı: 7019Kategori: ASP.NET MVC

 Bu makalemizde Asp.Net MVC 3 Razor View Engine’de User Control kullanarak MasterPage ile Controller sınıflarının nasıl buluşacağınız inceleyeceğiz.

Bu işlem için yeni bir Asp.NET MVC 3 (Empty) Web Application oluşturalım.
 
Oluşturduğumuz projeye HomeController isminde bir Controller ekleyelim.
 
Eklediğimiz Controllerın Index View’ını olşturalım. Oluştururken Layout seçimini yapalım.
 
 
Şimdi Views klasörünün altına UserControls klasörü oluşturalım ve “UC_Baslik.ascx” isminde bir Asp.NET MVC 3 View User Control control oluşturalım.
 
 
UC_Baslik.ascx isimli user controlümüze bir label ekleyelim ve bu label’ın text’ini Page_Load’da değiştirelim.
UC_Baslik.ascx
 
  1. <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
  2. <script runat="server">
  3.  
  4.     protected void Page_Load(object sender, EventArgs e)
  5.     {
  6.         lbBaslik.Text = "Başlık";
  7.     }
  8. </script>
  9.  
  10. <p>
  11.     <asp:Label ID="lbBaslik" runat="server" Text="Label"></asp:Label>
  12. </p>
Son olarak _Layout.cshtml dosyamıza gidelim ve layoutta aşağıdaki düzenlemeleri yapalım.
 
_Layout.cshtml
 
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title>@ViewBag.Title</title>
  5.     <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
  6.     <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
  7. </head>
  8.  
  9. <body>
  10.     <div style="background-color:Red; height:100px;">
  11.        @Html.Partial("~/Views/UserControls/UC_Baslik.ascx")
  12.     </div>
  13.     <div style="background-color:Yellow; height:200px;" >
  14.         @RenderBody()
  15.     </div>
  16. </body>
  17. </html>
Html.Partial methodu ile parametrede gönderdiğimiz user controlü sayfamıza ekliyoruz.
Şimdi projemizi çalıştıralım ve kırmızı alanda “Başlık” yazısını görelim.
 
 
 
 
Veysel Uğur KIZMAZ
Bilgisayar Mühendisi
veysel@ugurkizmaz.com
www.ugurkizmaz.com