MVC3 Display templates

Question

I've created custom Editor templates and Display templates. I've placed each of these types in a folder within my views folder. The folders were named either EditorTemplate or DisplayTemplate, depending upon which type of template was created.

So, now I can use EditorFor to use my custom editor template, or DisplayFor for my custom editor template.

I would like to create a custom template for a LabelFor, but I haven't found an example of this. Would I create a folder named Labeltemplate in my Views folder and add it here?

UPDATE

The reason I was trying to extend the LabelFor was to handle a Property that is of type KeyValuePair. I want to use the Key of this property as the Label, and the value as the Display. I asked a question here about the DisplayFor to handle the Value.

My solution ended up as>

   @Html.DisplayFor(m => m.MyProperty, @Model.MyProperty.Key)

Thanks,

Darin Dimitrov · Accepted Answer · 2011-12-07T18:03:50.993

6

LabelFor doesn't use any templates. It is hardcoded in the MVC source code and it spits a <label> no matter what you do.

You will have to write a custom html helper if you want to modify this behavior.

On the other hand if you want to use templates you have to use EditorFor/DisplayFor helpers. So, since a label is for displaying purposes you could use a display template and instead of using Html.LabelFor(x => x.Foo) use Html.DisplayFor(x => x.Foo). As far as the custom template is concerned, either you decorate the Foo property with the [UIHint] attribute or pass it as second argument to the DisplayFor helper.

UPDATE:

According to your comment you are not trying to modify the markup but only the value. That's what the second argument of the LabelFor helper could be used for:

@Html.LabelFor(x => x.Foo, Model.Key)
@Html.EditorFor(x => x.Foo)

This creates a label which is associated with the Foo input (for attribute of the label properly assigned) but the text shown is that of the Key property on your view model.

edited Dec 07 '11 at 18:03

answered Dec 07 '11 at 17:48

Darin Dimitrov

1,023,142
271
3,287
2,928

I'm fine with the label, but I'd like to set the label's inner text to a value other than what the helper uses. My property is a keyvaluepair, and I'd like to set the label to the 'Key' of the property. Any thoughts? – Jeff Reddy Dec 07 '11 at 17:58
Be careful of using "DisplayFor". Your solution would work but the DisplayFor was intended to be used to create a "read-only" display of a value and not to create a label for the property. By this I mean a DisplayFor for "DateTime" would be used to customize what format the data time was displayed. A "DisplayFor" template for your custom model or class would output values. – Nick Bork Dec 07 '11 at 17:59
Perhaps I'll just hard code the label, and not use a helper at all. – Jeff Reddy Dec 07 '11 at 17:59
@JeffReddy, that's what the second argument of the `LabelFor` helper could be used for: `@Html.LabelFor(x => x.Foo, Model.Key)`. This will generate a label for the Foo input but the value used will be that of the Key property on your view model. – Darin Dimitrov Dec 07 '11 at 18:00
http://stackoverflow.com/questions/8419484/how-can-i-create-a-custom-mvc3-template-or-html-helper-for-a-property-of-type-ke – Nick Bork Dec 07 '11 at 18:01
@Splash-X That question concerned the "VALUE" portion of my KeyValuePair property. That is shown using my DisplayFor. I'm now trying to create a Label using LabelFor that will display the "KEY" from my KeyValuePair property – Jeff Reddy Dec 07 '11 at 18:18

score 2 · Answer 2 · edited May 23 '17 at 12:22

2

There is no support for creating a template for a specific HTML Helper method (LabelFor).

You could:

Markup your model using meta descriptors to change what value gets displayed as part of the label:

 [DisplayName("Custom Label")]
 public string Test {get;set;}

You could create your own custom HTML Helper method for rending out a label:

How can I override the @Html.LabelFor template?

edited May 23 '17 at 12:22

Community

1
1

answered Dec 07 '11 at 17:52

Nick Bork

4,831
1
24
25

I tried the solution offered in that question, but I needed the 'Key' value from my KeyValuePair property. His question dealt with the formatting of the label (added a span tag). – Jeff Reddy Dec 07 '11 at 18:30
The code in that post was not an "end solution" for you, it wasn't mean to give you the basic code for creating an HTML Helper that could do what you wanted. – Nick Bork Dec 07 '11 at 19:32
It did give me the basics, but was missing a key element, the value of the property. It seemed the code only worked with metadata of the property, but not the value. That was all I really needed, but wasn't sure if it was available. – Jeff Reddy Dec 07 '11 at 20:54

score 1 · Answer 3 · answered Dec 07 '11 at 17:57

You can create a DisplayTemplate and access it via template name:

@Html.DisplayFor(x => x.Foo, "label")

And then just create a template called label.cshtml in your DisplayTemplates folder.

To simplify this call, you can write an extension method that handles this call:

public static MvcHtmlString TemplateLabelFor<TModel, TProperty>(this HtmlHelper<TModel> html, Expression<Func<TModel, TProperty>> property) 
{
    return html.DisplayFor(property, "label");
}

MVC3 Display templates

3 Answers3