Customattribute Reflects HTML Attribute MVC5

CustomAttribute reflects html attribute MVC5

If using the standard helpers with the overload to add html attributes is not acceptable, then you can create an attribute implements IMetadataAware that adds properties to metadata.AdditionalValues which can then be used in custom html helpers. A simple example might be

[AttributeUsage(AttributeTargets.Property)]
public class CustomHtmlAttribute : Attribute, IMetadataAware
{
  public static string ValueKey
  {
    get { return "Value"; }
  }
  public string Value { get; set; }
  public void OnMetadataCreated(ModelMetadata metadata)
  {
    if (Value != null)
    {
      metadata.AdditionalValues[ValueKey] = Value;
    }
  }
}

and to create a helper to render a textbox (only one overload shown here)

public static MvcHtmlString CustomHtmlTextBoxFor<TModel, TValue>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TValue>> expression)
{
  ModelMetadata metaData = ModelMetadata.FromLambdaExpression(expression, helper.ViewData);
  object attributes = null;
  if (metaData.AdditionalValues.ContainsKey(ValueKey))
  {
    attributes = new { customhtml = (string)metaData.AdditionalValues[ValueKey] };
  }
  return InputExtensions.TextBoxFor(helper, expression, attributes);
}

and use it as

[CustomHtml(Value = "hello")]
public string CoolValue { get; set; } 

and in the view

@Html.CustomHtmlTextBoxFor(m => m.CoolValue)

to make this a bit more flexible, you could add more properties to the attribute so you could apply it as

[CustomHtml(Value = "hello", Pattern="/d")]
public string CoolValue { get; set; }

and modify the helper to render all the html attributes you define.

MVC 5 Add 'data-' attribute with Custom Data Annotation

Even if you were to create a custom attribute, which would need to implement MetadataAware in order to add the value to the AdditionalValues property of ModelMetadata, you still then need to create your own extension methods to read that value and add it to the htmlAttributes.

For an example of how to implement it, refer CustomAttribute reflects html attribute MVC5.

However, that is unnecessary since HTML inputs already store the initial value. For a <input> (other than a checkbox) or <textarea> its defaultValue. For a <input type="checkbox" /> its defaultChecked and for <select> its defaultSelected.

So in the case of your @Html.TextBoxFor(m => m.InputText), your could use for example

using javascript

var element = document.getElementById ("InputText");
var initialValue = elem.defaultValue;
// reset to initial value
element.value = initialValue;

or using jQuery

var element = $('#InputText');
var initialValue = element.prop('defaultValue');
// reset to initial value
element.val(initialValue);

Is there an MVC5 model attribute for setting HTML Size attribute and MaxLength?

Well, as far as I know, ViewModel and Model are not supposed to contain information about how things are going to be rendered. They are supposed to contain only types (eg. field is string) and requirements (eg. field not empty).

Therefore IMHO rendering objects (how inputs should look like) should be inside of Razor View. In fact MVC5 has added new option to achieve that - you can pass htmlAttributes object to additionalViewData object argument while rendering EditorFor.

@Html.EditorFor(model => model.Title, new { htmlAttributes = new { @class = "form-control", custom_attribute = "lol" } })

This was not possible in MVC3 and MVC4, since few Html Helpers accepted htmlAttributes as an argument and few Html Helpes accepted only additionalViewData

Also I think you should rather use [MaxLength(int i)] if you intend to limit length of the input in ViewModel (as this will also help MVC to validate it client and server side)

    [DisplayName("Name")]
    [Required]
    [MaxLength(5)]
    public string Name{ get; set; }

---

Related Topics