ASP.NET MVC 2 editor template for value types, int

Question

I want to create a MVC 2 editor template for a value type i.e. int , has anyone done this with the preview 1 bits?

Many thanks

Answer 1

Will Nick Clarke's answer work when you submit the values on postback?

In MVC2 preview 2, calling Html.Textbox("abc", Model.ToString()) will render a textbox with ".abc" appended to the name, e.g.

<input id="StartDate_abc" name="StartDate.abc" type="text" value="02 Feb 09" />

which will cause problems when you postback and attempt to UpdateModel().

I did an editor template for a DateTime, the following works for me:

/Views/Shared/EditorTemplates/DateTime.ascx:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<DateTime>" %>
<%= Html.TextBox(String.Empty, Model.ToString("dd MMM yy")) %>

or, to use jQuery's DatePicker for all your DateTimes add a reference to jQuery and jQueryUI to either your Masterpage or to the View containing the call to EditorFor.

/Views/Shared/EditorTemplates/DateTime.ascx:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<DateTime>" %>
<%= Html.TextBox("", Model.ToString("dd MMM yy")) %>
<script type="text/javascript">
    $("#<%= ViewData.ModelMetadata.PropertyName %>").datepicker({ dateFormat: 'dd M y' });
</script>

Update: ASP.NET MVC3, using the Razor syntax:

@model System.DateTime
@Html.TextBox("",  Model.ToString("dd MMM yy"))
<script type="text/javascript">
    $("#@ViewData.ModelMetadata.PropertyName").datepicker({ dateFormat: 'dd M y' });
</script>

And to use it all you need in your View is:

@Html.EditorFor(model => model.DueDate)

-Matt

Answer 2

I have found Brad Wilson's blog to have the best examples and explanations. Part-3 of the series talks specifically about value types (String, decimal, Int32).

Enjoy!

Answer 3

I've written a blog post about how to do this by creating reusable templates in MVC 2.

My post also explains the relationship between TemplateInfo and templates.

Answer 4

I have not tried preview 1 yet but they did what you are asking for in this channel9 video:

http://channel9.msdn.com/posts/Glucose/Hanselminutes-on-9-ASPNET-MVC-2-Preview-1-with-Phil-Haack-and-Virtual-Scott/

They do both DisplayFor and EditorFor, starts around 2 minutes.

--Edit--

For value type i.e. int I was able to get it to work in the same way.

Create a model to pass to my view:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        HomeModel model = new HomeModel();
        model.message = "Welcome to ASP.NET MVC!";
        model.number = 526562262;
        model.Date = DateTime.Now;

        return View(model);
    }
}

public class HomeModel
{
    public string message { get; set; }

    public int number { get; set; }

    public DateTime Date { get; set; }
}

Link view to the model using the new template logic:

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<HomeModel>" %>

<asp:Content ID="indexContent" ContentPlaceHolderID="MainContent" runat="server">
<p>
    <% Html.EditorFor(c => c.message); %>
</p>
<p>
    <% Html.EditorFor(c => c.number); %>
</p>
<p>
    <% Html.EditorFor(c => c.Date); %>
</p>

Then create a template for each of the types e.g. Int32:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
Editor For My Int32: <%= Html.TextBox("abc", Model.ToString())%>

I put this in Views\Shared\EditorTemplates\Int32.ascx