MVC
UIHint
ASP.NET
duplicate-question
web-development

What is use of UIHint attribute in MVC

Interview Questions practice on Codemia

Over 8,000 real interview questions from top companies, searchable by company and role.

Browse interview questions

Introduction

UIHint in ASP.NET MVC lets you choose which editor or display template should render a model property. It is useful when default template selection is not specific enough for your domain, such as custom date pickers, money fields, or masked identifiers. Using templates keeps rendering rules centralized and avoids duplicating markup across many views.

How UIHint Works In The MVC Pipeline

When you call helpers like EditorFor or DisplayFor, MVC searches template files by naming conventions. If a property has a UIHint attribute, that hint name is used to pick the template first.

Model example:

csharp
1using System;
2using System.ComponentModel.DataAnnotations;
3
4public class InvoiceViewModel
5{
6    public int Id { get; set; }
7
8    [UIHint("Currency")]
9    public decimal TotalAmount { get; set; }
10
11    [UIHint("ShortDate")]
12    public DateTime DueDate { get; set; }
13}

With this model, EditorFor(m => m.TotalAmount) resolves to Views/Shared/EditorTemplates/Currency.cshtml, and DueDate resolves to ShortDate.cshtml.

Creating Reusable Templates

Editor template for currency:

cshtml
1@model decimal
2@{
3    var value = Model.ToString("0.00");
4}
5<input
6    type="text"
7    name="@ViewData.TemplateInfo.GetFullHtmlFieldName("")"
8    value="@value"
9    class="currency-input" />

Editor template for short date:

cshtml
1@model DateTime
2<input
3    type="date"
4    name="@ViewData.TemplateInfo.GetFullHtmlFieldName("")"
5    value="@Model.ToString("yyyy-MM-dd")" />

Then render in a view:

cshtml
1@model InvoiceViewModel
2
3<form method="post">
4    <div>
5        <label>Total</label>
6        @Html.EditorFor(m => m.TotalAmount)
7    </div>
8    <div>
9        <label>Due Date</label>
10        @Html.EditorFor(m => m.DueDate)
11    </div>
12    <button type="submit">Save</button>
13</form>

Template reuse pays off quickly in larger applications because UI behavior stays consistent everywhere.

UIHint Versus DataType And Custom Helpers

DataType is good for broad semantics like date, email, or currency, while UIHint is better when you need a specific template name under your control. Custom HTML helpers are still valuable for more dynamic scenarios, but template based rendering is often simpler for property level customization.

A useful rule is:

  • Prefer DataType for generic semantics.
  • Prefer UIHint for project specific template selection.
  • Prefer custom helper or tag helper when behavior needs rich parameters.

Testing And Maintainability

Treat templates as UI building blocks. Add integration tests that render views and assert expected markup, especially for formatting and binding names. Keep template logic minimal and move heavy business rules into view models or services.

Also ensure editor templates preserve binding compatibility. The input name attribute must align with MVC model binding conventions so posted values map back correctly.

Advanced Template Selection Patterns

UIHint supports scenarios where a single model is rendered in different contexts, such as create forms, edit forms, and read only previews. You can keep one model type while changing template behavior through view mode conventions and metadata.

A practical approach is to keep template names stable and use view data only for small display variations. If template behavior diverges heavily, create a new template rather than adding many branches. That keeps each template easy to reason about and easier to test.

You can also pair UIHint with editor template specific view models to keep rendering dependencies explicit. This prevents hidden coupling to unrelated controller state and reduces breakage when views are reused across areas.

Deployment And Team Workflow Guidance

Store templates in Views/Shared/EditorTemplates when they are cross feature assets, and feature local folders when they are domain specific. This naming discipline helps reviewers understand scope during pull requests.

During upgrades, run smoke tests that render forms containing all UIHint fields. Template path regressions are common after refactors, and this check catches them before release.

Common Pitfalls

  • Using UIHint but rendering with raw TextBoxFor, which bypasses template selection.
  • Mismatching template file names and attribute values.
  • Adding too much conditional logic inside template files.
  • Forgetting culture specific formatting for dates and decimal values.
  • Assuming UIHint replaces server side validation rules.

Summary

  • UIHint selects a named template for property rendering in MVC.
  • It works best with EditorFor and DisplayFor helpers.
  • Shared templates reduce duplication and enforce UI consistency.
  • Keep templates focused on rendering, not business logic.
  • Combine UIHint with validation attributes for complete behavior.

Related reading
Course
Intermediate
27 lessons
14 hours
OOD Fundamentals

Master object-oriented design from first principles, SOLID, design patterns, and classic interview problems with hands-on coding.

View the course
Track what you have practised

A free account saves your progress, solutions and study plan across every problem on Codemia.

Interview Questions practice on Codemia

Over 8,000 real interview questions from top companies, searchable by company and role.

Browse interview questions

All Rights Reserved.