MVC Custom Model Annotation without validation

Question

So, there are tons of examples of making custom data validators, but what I need is a Data Annotation that will just add an attribute to the final markup. My google-fu must just be weak today. The basic idea would be:

Model.cs

[SomeCustomAttribute]
public int CoolProperty {get;set}

View.cshtml

@Html.EditorFor(q => q.CoolProperty)

Then, the magical Wizardry ensues here:

public class SomeCustomAttribute : SomeAwesomeClassToInheritThatICantFind {
  public override void AddAttributes() {
     AddAttribute("CustomAttribute");
  }
}

And, finally I'd like the markup rendered as:

<input type="text" CustomAttribute>

Obviously it'd be more complicated, but that's the gist of it. I know i can just chuck this in the view, but I'm going to be reusing this particular logic all over the place and it seems like there should be some way to do this. Something similar to the Display attribute.

If there's another approach that I'm missing, I'm all for that as well.

Answer 1

You could use a custom editor template:

1) Create the folder /Views/Shared/EditorTemplates

2) Create inside this folder the file SomeCustomAttributes.cshtml

3) In the template file you'll have to specify the type to which the template can be applied and the rules (adding an @Html.TextBox with two attributes, class and maxlength):

@model int

@Html.TextBox("", (Model), new { @class = "someClass" , maxlength="5"})

4) Finally,use the UIHint attribute to specify the custom template:

[UIHint("SomeCustomAttributes")]
public int CoolProperty {get;set}

You should get an input type=text with attributes class=someClass and maxlength=5

Answer 2

This may also be a good candidate for a custom HTML Helper method - this would allow you to reuse it in other areas of your application. This is what I did to mimic the standard ActionLink method; mine allows me to specify bootstrap glyphicon classes.

1. Create a static class to hold your html helper method(s); mine is called HtmlHelpers .

2. Inside this class, define and implement a static method that encapsulates the logic you need. I called my method BootstrapActionLink. Because this is an extension method, the first parameter needs to be this HtmlHelper parameterName .

3. Since you want to reuse in different areas of your application, you will want to add the class namespace (step 1) to the web.config file located in the ~/Views folder ( not the top-level web.config).

4. You can now use your HTML helper method in any of your views.

Below is my helper method code that makes use of the TagBuilder class:

public static MvcHtmlString BootstrapActionLink(this HtmlHelper htmlHelper, string linkText, string linkUrl, string bootstrapClasses, string glyphClasses)
{
    TagBuilder anchor = new TagBuilder("a");
    anchor.MergeAttribute("href", linkUrl);
    anchor.AddCssClass(bootstrapClasses);

    TagBuilder span = new TagBuilder("span");
    span.AddCssClass(glyphClasses);

    anchor.InnerHtml = linkText + " " + span.ToString();

    return MvcHtmlString.Create(anchor.ToString());
}

Inside ~/Views/Web.config I have

<system.web.webPages.razor>
    ...
    <namespaces>
        <add namespace="ApplicationName.NamespaceName"/>

In my views I use the following code

@Html.BootstrapActionLink("Add Account", @Url.Action("Add", new { employeeId = @Model.EmployeeId.Trim() }), "btn btn-primary", "glyphicon glyphicon-plus")

The generated output looks like this:

<a class="btn btn-primary" href="/myapplication/Add/123456">Add Account <span class="glyphicon glyphicon-plus"></span></a>