Duplicate input identifiers when using multiple partial elements in ASP.NET MVC

Question

I have three partial views, each of which is strongly typed with separate models. Each view contains its own form and is subject to various actions. Some of the models contain properties with the same name, and when I use the html helper methods to create text fields and labels, I get duplicate html identifiers on the page.

Partial _Residential View

@model MyProject.Models.ResidentialModel @using (Html.BeginForm("Residential", "Transaction")) { @Html.LabelFor(m => m.PersonName) @Html.TextBoxFor(m => m.PersonName) @Html.LabelFor(m => m.ReferenceNumber) @Html.LabelForm(m => m.ReferenceNumber) <input type="submit" value="Submit" /> } 

Partial Business View

 @model MyProject.Models.BusinessModel @using (Html.BeginForm("Business", "Transaction")) { @Html.LabelFor(m => m.BusinessName) @Html.TextBoxFor(m => m.BusinessName) @Html.LabelFor(m => m.ReferenceNumber) @Html.LabelForm(m => m.ReferenceNumber) <input type="submit" value="Submit" /> } 

Normal view

 <h2>Residential Transaction</h2> @Html.Partial("_Residential") <h2>Business Transaction</h2> @Html.Partial("_Business") 

The result that I get is as follows:

 <h2>Residential Transaction</h2> <form action="/Transaction/Residential" method="post"> <label for="PersonName">Person Name:</label> <input type="text id="PersonName" name="PersonName" /> <label for="ReferenceNumber">Reference Number:</label> <input type="text" id="ReferenceNumber" name="ReferenceNumber" /> <input type="submit" value="Submit" /> </form> <h2>Business Transaction</h2> <form action="/Transaction/Business" method="post"> <label for="BusinessName">Business Name:</label> <input type="text" id="BusinessName" name="BusinessName" /> <label for="ReferenceNumber">Reference Number:</label> <input type="text" id="ReferenceNumber" name="ReferenceNumber" /> <input type="submit" value="Submit" /> </form> 

Since ReferenceNumber is in both models, I get a duplicate identifier on the page. I realized that I can pass an additional parameter htmlAttributes to TextBoxFor to change the identifier.

 @Html.TextBoxFor(m => m.ReferenceNumber, new { id = "ResidentialReferenceNumber" }) ... @Html.TextBoxFor(m => m.ReferenceNumber, new { id = "BusinessReferenceNumber" }) 

This fixes the identifiers on the inputs, but the 'for' attribute on the labels still has the wrong value. I looked at various overloads for LabelFor (), and unlike TextBoxFor, there is no htmlAttributes property. Is there a way to show a model or view to use a different identifier for these fields?

Answer 1

MVC helpers do not take into account that you can have multiple models in a view. All properties with the same name will receive duplicate values ​​(one value for each model).

That is, if ResidentalTransaction and BusinessModel have the Name property, your html form will have two fields <input type="text" name="Name" /> .

I'm not sure how this works if you add all the models to the same view model and use Html.TextBoxFor(m => m.ResidentalTransaction.Id);