Using EditorTemplate in MVC3

Discussing usage and benefits of Editor Templates in MVC3

Using EditorTemplate in MVC3

Recently, I was asked to build a quality assurance application for our Claims department. The application was not complex.
Qualifying users should be able to select one of the claims that we are managing and
rate it in several categories where each category has several questions. Each question contains the same
set of possible answers where the user can answer “meets the requirements”, “does not meet the requirements”
or leave it unanswered.

Using MVC DropDownListFor for each of the questions could have become one of the major annoyances
of that application, so I have found a solution in implementing Editor Template
and using EditorFor instead of DropDownListFor in Create view. Initial code for RatingDropDown looked like this:

@model int?
@Html.DropDownList("",new SelectList(new[] {
new SelectListItem{ Text="---select---", Value="0"},
new SelectListItem{ Text="Meet the requirements",Value="1"} ,
new SelectListItem{ Text="Does not meet the requirements", Value="2"}
}, "Value", "Text"))

NOTE: I am using Nullable integer as a model for the template, because in Create view on rendering null is being passed from the database.
Just in case you are new to MVC and Editor Templates I will mention how to prompt MVC to render our template.
Since by default EditorFor helper for integer will render as a input type=”text”
we need to add an attribute to Model property we want to be rendered as select element, so your property should look like this:

[UIHint("RatingsDropDown")]
public int EffectiveUseDiary { get; set; }

then your select will be rendered appropriately. (Just don’t forget to add to your class reference to System.ComponentModel.DataAnnotations - that is where UIHint leaves).
We are almost done. The last problem you will notice is that in the Edit View in our select control previously saved values will not be selected.
To fix that, we need to implement one last correction in our Editor Template, so it will look like this:

@model int?
@Html.DropDownList("",new SelectList(new[] {
new SelectListItem{ Text="---select---", Value="0"},
new SelectListItem{ Text="Meet the requirements",Value="1"} ,
new SelectListItem{ Text="Does not meet the requirements", Value="2"}
}, "Value", "Text", (Model.HasValue?Model.Value:0)))

Now we updated Editor Template with the logic which checks if there is value in our model and provides mechanism to ensure that the value will be selected or if value is null than first option in the select element will be selected.
We are done coding there is only one unanswered question left: What are the BENEFITS of all that?
The answer is simple: Firstly, result of operations above is a simpler, better looking and more maintainable, readable code. Instead of having for each question

@Html.DropDownListFor(model=>model.YourQuestionProp, new SelectList(new[] {
new SelectListItem{ Text="---select---", Value="0"},
new SelectListItem{ Text="Meet the requirements",Value="1"} ,
new SelectListItem{ Text="Does not meet the requirements", Value="2"}
}, "Value", "Text",”YourSelectedVal”))

You getting just this

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

Secondly, if later on user will decide to add more items in performance rating, they can all be done in one location – our Editor Template.

That’s it.
Happy coding.

By Yuri Kasan   Popularity  (7662 Views)
Biography - Yuri Kasan
Yuri Kasan, is the lead developer of the corporate intranet at Mellon Investor Services, LLC. Yuri, who is an Microsoft Certified Developer specializes in the implementation of a wide variety of applications using Microsoft technologies. His expertise includes assisting his users in maximizing their investment in Microsoft desktop, server and development technologies. You can reach Yuri via email at ykasan@yahoo.com