Issue with asp-validation-for when used in a loop

Question

I am having an issue with the asp-validation-for on a span element in the code below.

 <div class="form-group">
                @if (Model.Property.Options.ElementAt(i).OptionTypeId == PropertyOptionType.CheckBox)
                {
                    var ItemChecked = (Model.Property.Options.ElementAt(i).OptionValue == "on") ? " checked" : "";
                    <text><input type="checkbox" class="form-check-input" name="Options[@i].Code" id="Options[@i].Code" @ItemChecked data-val="false" />
                        <label class="form-check-label" for="Options[@i].Value">&nbsp;@(Model.Property.Options.ElementAt(i).OptionValue)</label></text>
                }
                else if (Model.Property.Options.ElementAt(i).OptionTypeId == PropertyOptionType.List)
                {
                    <label class="control-label">
                        @Model.Property.Options.ElementAt(i).OptionValue
                    </label>
                    <select class="form-control" name="Options[@i].Code"></select>
                }
                <span class="text-danger field-validation-valid" data-valmsg-replace="true" data-valmsg-for="Options.@(i).Code"></span>

When it is rendered in HTML it comes out as

<span class="text-danger field-validation-valid" data-valmsg-replace="true" data-valmsg-for="Options.[3].Code"></span>

But no validation error messages ever land in the span. They are picked up in a page level validation summary when set to all so the unobtrusive code is all working correctly but the ID of the span is being broken by the square brackets.

Any ideas? Thanks Mark

Its a typo - you have an extra `.` (dot) in `data-valmsg-for="Options.[3].Code"` - it needs to be `data-valmsg-for="Options[3].Code"` (and why in the world are you generating your html manually like that instead of strongly binding to your model?) — , Oct 20 '18 at 22:57

Hooman Bahreini · Answer 1 · 2018-10-21T05:10:05.590

0

To display Validation Summary, you need to include:

@Html.ValidationSummary(false/*excludePropertyErrors?*/, "", new { @class = "text-danger" })

To display field specific error message, you need to use ValidationMessageFor:

@Html.EditorFor(model => model.StudentName, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.StudentName, "", new { @class = "text-danger" })

See this tutorial

Don't manually generate the validation span, html helpers will do that for you... you would need something like this:

@for (int i = 0; i < Model.Property.Options.Count(); i++)
{
    /* this one generates the input */
    @Html.EditorFor(m => m.Property.Options[i], new { htmlAttributes = new { @class = "form-control" } })

    /* this one generates the validation message */
    @Html.ValidationMessageFor(m => m.Property.Options[i], "", new { @class = "text-danger" })
}

edited Oct 21 '18 at 05:10

answered Oct 20 '18 at 21:07

Hooman Bahreini

14,480
11
70
137

Hi there - this isn't the issue I it results in a span `` and completely loses the context of the data-valmsg-for element! – MCFH Oct 20 '18 at 22:21
The last span in the original code post. This is inside a for loop that is causing the problem! – MCFH Oct 21 '18 at 04:54
The HTML helpers also don't generate the correct decoration on the name and id - they strip it out to just 'Options' – MCFH Oct 22 '18 at 08:59

Issue with asp-validation-for when used in a loop

1 Answers1