Custom Helper is not working correctly

Question

I have created the following Html Helper Class for displaying a Image:

Class:

namespace MvcWebMobile.CustomHelpers
{
    public static class CustomHelper
    {
        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 RouteValueDictionary(htmlAttributes));

            // Render tag
            return builder.ToString(TagRenderMode.SelfClosing);
        }
    }
}

View:

@Html.Image("img1", "../../Content/images/icons-18-black.png", "logo")

Now when i use the custom helper in my view the Image is not displayed, instead of image following message is printed on web page

<img alt="logo" id="img1" src="../../Content/images/icons-18-black.png" /> <img alt="logo" border="4px" id="img1" src="../../Content/images/icons-18-black.png" />

why don't u pass app relative path of image ? – Bilal Fazlani Sep 25 '13 at 11:10 — Bilal Fazlani, Sep 25 '13 at 11:10
"~/Content/images/icons-18-black.png" – Bilal Fazlani Sep 25 '13 at 11:13 — Bilal Fazlani, Sep 25 '13 at 11:13
I tried but it is not working. – Bhupendra Shukla Sep 25 '13 at 11:17 — Bhupendra Shukla, Sep 25 '13 at 11:17

score 2 · Accepted Answer · answered Sep 25 '13 at 11:15

2

Your helper should return a HtmlString instead of a string.

public static HtmlString Image(this HtmlHelper helper, string id, string url, string alternateText)
{
    return Image(helper, id, url, alternateText, null);
}

public static HtmlString Image(this HtmlHelper helper, string id, string url, string alternateText, object htmlAttributes)
{
    // ...
    return new HtmlString(builder.ToString(TagRenderMode.SelfClosing));
}

answered Sep 25 '13 at 11:15

user247702

23,641
15
110
157

why we shouldn't use mvcHtmlString? – Bhupendra Shukla Sep 25 '13 at 11:24
My comment is a link, click it. It works too, but in the future it may become deprecated, there's no reason to use it instead of `HtmlString`. – user247702 Sep 25 '13 at 11:26

score 1 · Answer 2 · answered Sep 25 '13 at 11:18

1

Instead of returning string try returning MvcHtmlString,

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

 }

answered Sep 25 '13 at 11:18

Jatin patil

4,252
1
18
27

[You shouldn't use `MvcHtmlString` in MVC 3 and up.](http://stackoverflow.com/a/3382908/247702) – user247702 Sep 25 '13 at 11:21

score 1 · Answer 3 · answered Oct 15 '13 at 09:14

Use MvchtmlString:

public static MvcHtmlString Image(this HtmlHelper helper, string id, string url, string alternateText)
 {
// ...
    return new MvcHtmlString(builder.ToString(TagRenderMode.SelfClosing));
 }

Custom Helper is not working correctly

3 Answers3