Question

I would like to transform my

<input type="file" id="image" name="image">

with something like

@Html.UploadFor(model => model.Image)

Something more MVC friendly…

I know that I have to create a helper for that with Linq Expression capabilities.

How this can be done?

EDIT

Here is one solution:

    public static MvcHtmlString UploadFor<TModel, TProperty>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression)
    {
        var builder = new TagBuilder("input");
        builder.MergeAttribute("type", "file");
        builder.MergeAttribute("id", HtmlExtensions.IdFor(helper, expression));
        builder.MergeAttribute("name", HtmlExtensions.NameFor(helper, expression));
        return new MvcHtmlString(builder.ToString(TagRenderMode.SelfClosing));
    }

public static class HtmlExtensions
{
    public static string NameFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression)
    {
        return htmlHelper.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldName(ExpressionHelper.GetExpressionText(expression));
    }

    public static string IdFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression)
    {
        return HtmlHelper.GenerateIdFromName(NameFor(htmlHelper, expression));
    }
}

Answer 1

See this reference/tutorial for creating custom HTML Helpers: http://www.asp.net/mvc/tutorials/creating-custom-html-helpers-cs

public static MvcHtmlString UploadFor<TModel, TProperty>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression) 
{ 
    // generate your HTML 
}