HTML Helper 만들고 TagBuilder 사용하기

 

ASP.NET MVC 프레임웍은 HTML Helper를 만들때 TagBuilder라는 utility 클래스를 사용한다.

TagBulider 클래스는 손쉽게 HTML 태그를 만드는 것을 가능하게 하고 생각하네 하는 클래스이다.

 

TagBulider클래스는 System.Web.Mvc 네임스페이스에서 제공되고 5개의 Method를 가지고 있다.

 

AddCssClass()

새로운 Class=”” 속성을 추가

GenerateId()

Id 속성 추가

MergeAttribute()

속성을 추가. 다수의 overload 제공

SetInnerText()

Inner text 추가.

ToString()

기본적인 tag, “<”, “>”, “< />”

 

 

Image HTML Helper 만들기

tag명을 넣어 TagBuilder 생성자를 통해 TagBuilder Class의 인스턴스를 만든다.

다음으로 태그의 속성을 수정하기 위해 AddCssClass MergeAttribute() 메소드를 호출한다.

마지막으로 ToString() 메소를 호출하여 태그를 제공한다.

 

/Helpers/ImageHelper.cs

 

using System.Web.Mvc;

using System.Web.Routing;

 

namespace MvcMyApplication4.Helpers

{

    public static class ImageHelper

    {

        public static string Image(this HtmlHelper helper, string id, string url, string alternateText)

        {

            return Image(helper, id, url, alternateText, null);

        }

 

        public static string Image(this HtmlHelper helper, string id, string url, string alternateText, object htmlAttributes)

        {

            // Create tag builder

            var builder = new TagBuilder("img");

 

            // Create valid id

            builder.GenerateId(id);

 

            // Add attributes

            builder.MergeAttribute("src", url);

            builder.MergeAttribute("alt", alternateText);

            builder.MergeAttributes(new RouteVal!ueDictionary(htmlAttributes));

 

            // Render tag

            return builder.ToString(TagRenderMode.SelfClosing);

        }

    }

}

 

/Home/Index.aspx

 

<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

<%@ Import! Namespace="MvcMyApplication4.Helpers" %>

 

<asp:Content ID="indexTitle" ContentPlaceHolderID="TitleContent" runat="server">

    Home Page

</asp:Content>

 

<asp:Content ID="indexContent" ContentPlaceHolderID="MainContent" runat="server">

 

    <!-- Calling helper without HTML attributes -->

    <%= Html.Image("img1", ResolveUrl("~/Content/XBox.png"), "XBox Console") %>

 

    <!-- Calling helper with HTML attributes -->

    <%= Html.Image("img1", ResolveUrl("~/Content/XBox.png"), "XBox Console", new {border="4px"})%>

 

</asp:Content>

 

 

 

 

<%@ Import! Namespace="MvcMyApplication4.Helpers" %> index.aspx view의 상단에 반드시 import! 해야 한다.

'Web Platform' 카테고리의 다른 글

ASP.NET MVC 액션 필터  (0) 2009.06.29
ASP.NET MVC 마스터 페이지  (0) 2009.06.29
ASP.NET MVC View  (0) 2009.06.29
ASP.NET MVC Routing 기술  (0) 2009.06.29
ASP.NET MVC 개발 환경 만들기  (0) 2009.06.29

+ Recent posts