Image ActionLink با HtmlHelper در Mvc

سه شنبه 31 فروردین 1395

در این مقاله می خواهیم درباره ی Image action link به وسیله ی htmlhelper در asp.net mvc صحبت نماییم و در مورد یک نمونه قرار دهیم.

 Image ActionLink با HtmlHelper در Mvc

برای درست کردن یک لینک در asp.net mvc ما از linkextension ها استفاده می نماییم، برای ایجاد یک تگ ساده ما از Html.Actionlink استفاده می نماییم.

به عنوان مثال به صورت زیر خواهد بود:



@Html.ActionLink("Link Display Text","Index","Home")

کد html به صورت زیر خواهد بود:

    <a href="/Home/Index">Link Display Text</a>  

حالا اگر ما بخواهیم از یک تصویر استفاده کنیم باید لینک زیر را استفاده کنیم:

<a href="/Home/Index">  
<img src="/images/untitled.png">  
</a>

برای ایجاد یک تصویر ما باید از متد htmlaction استفاده کنیم، ولی می توان برای نمایش تصاویر از htmlhelper استفاده نماییم.

ما می توانیم htmlhelper را با توجه به نیازمان در هر جایی که به آن نیاز داریم استفاده نماییم.

بنابر این ما باید یک extention helper را ایجاد کنیم و آن را در هر جایی که خواستیم استفاده کنیم.

برای ایجاد یک extension helper اول از همه یک کلاس استاتیک ایجاد می کنیم.

در اینجا یک کد برای extention method برای ImageAction link به صورت زیر است:

namespace MyApplication.Helpers  
  
{  
  
    public static class CustomHtmlHelepers  
  
    {  
  
        public static IHtmlStringImageActionLink(this HtmlHelperhtmlHelper,  
  
            string linkText, string action, string controller,  
  
            object routeValues, object htmlAttributes, stringimageSrc)  
  
        {  
  
            varurlHelper = new UrlHelper(htmlHelper.ViewContext.RequestContext);  
  
            varimg = new TagBuilder("img");  
  
            img.Attributes.Add("src", VirtualPathUtility.ToAbsolute(imageSrc));  
  
            var anchor = new TagBuilder("a")  
  
            {  
                InnerHtml = img.ToString(TagRenderMode.SelfClosing)  
            };  
  
            anchor.Attributes["href"] = urlHelper.Action(action, controller, routeValues);  
  
            anchor.MergeAttributes(new RouteValueDictionary(htmlAttributes));  
  
            returnMvcHtmlString.Create(anchor.ToString());  
  
        }  
  
    }  
  
}

اولین پارامتر برای ارسال استفاده از extention method است.

برای درست کردن view باید view مورد نظر فضای نام را داخل خود قرار دهد، اما اگر شما یک فضای نام یکسان داشته باشید بدون اضافه کردن کدی در view نمایش داده می شود.

بنابر این تمام extention method ها در یک فضای نام جداگانه به نام helper قرار دهیم یک نمونه به صورت زیر خواهد بود:



@using MyApplication.Helpers;

@Html.ImageActionLink("Link Display Text",

"Index","Home",null,null,"~/images/untitled.png")

برای اینکه در یک html یکسان نمایش داده شود باید کد بالا را بنویسیم.

    <a href="/Home/Index">  
    <img src="/images/untitled.png">  
    </a>  

هدف از این مقاله این بود که شما بتوانید یک html helper سفارشی خودتان در asp.net mvc بسازید.

برنامه نویسان

نویسنده 3355 مقاله در برنامه نویسان

کاربرانی که از نویسنده این مقاله تشکر کرده اند

در صورتی که در رابطه با این مقاله سوالی دارید، در تاپیک های انجمن مطرح کنید