If I have en extension like that :
public static string ImageLink(this HtmlHelper htmlHelper,
string imgSrc,
string alt,
string actionName,
string controllerName,
object routeValues,
object htmlAttributes,
object imgHtmlAttributes)
{
return @"<img src=""../../Content/images/english.png"" /> ";
}
and I use it in a partial view like this :
@Html.ImageLink("../../Content/images/english.png","English", "ChangeCulture", "Account", new { lang = "en", returnUrl = this.Request.RawUrl }, null,null)
I have an output like this :
Any idea why?
The reason this happens is because the @
operator in Razor automatically HTML encodes. If you want to avoid this encoding you need to use an IHtmlString
:
public static IHtmlString ImageLink(
this HtmlHelper htmlHelper,
string imgSrc,
string alt,
string actionName,
string controllerName,
object routeValues,
object htmlAttributes,
object imgHtmlAttributes
)
{
return MvcHtmlString.Create(@"<img src=""../../Content/images/english.png"" />");
}
which obviously will be far more correct (and working in all situations, no matter from where and how this helper is called) if written like this:
public static IHtmlString ImageLink(
this HtmlHelper htmlHelper,
string imgSrc,
string alt,
string actionName,
string controllerName,
object routeValues,
object htmlAttributes,
object imgHtmlAttributes
)
{
var img = new TagBuilder("img");
var urlHelper = new UrlHelper(htmlHelper.ViewContext.RequestContext);
img.Attributes["src"] = urlHelper.Content("~/Content/images/english.png");
// Don't forget that the alt attribute is required if you want to have valid HTML
img.Attributes["alt"] = "English flag";
return MvcHtmlString.Create(img.ToString(TagRenderMode.SelfClosing));
}
and then
@Html.ImageLink("../../Content/images/english.png","English", "ChangeCulture", "Account", new { lang = "en", returnUrl = this.Request.RawUrl }, null,null)
will work properly.
As an alternative if you cannot modify the helper you could use @Html.Raw
:
@Html.Raw(Html.ImageLink("../../Content/images/english.png","English", "ChangeCulture", "Account", new { lang = "en", returnUrl = this.Request.RawUrl }, null,null))
Have it return MvcHtmlString
instead (my sample below).
public static MvcHtmlString IconImg(this HtmlHelper htmlHelper, string icon, string title = "", string size = "16x16") {
string path = VirtualPathUtility.ToAbsolute("~/res/img/icons/" + size + "/" + icon + ".png");
string imgHtml = "<img src='" + path + "' title='" + title + "' style='border:none' />";
return new MvcHtmlString(imgHtml);
}