StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POMVC4 ValidationMessageFor
text
Body
copied!<p>I have a view which accesses the data annotations contained within the model using ValidationMessageFor, and works with no problems. However, instead of displaying the validation message besides the relevant control (as standard practice), I want to display the validation message when the user hovers over a validation warning icon. </p> <p>I have managed to get this partly working, but it requires the control in question has focus prior to the user clicking the validation warning icon, otherwise it displays nothing. Is it possible to retrieve the validation message via jQuery?</p> <p>Model:</p> <pre><code>[Required(ErrorMessageResourceName = "EmailRequiredErrorMessage", ErrorMessageResourceType = typeof(Resources.Languages.Models.RegistrationValidateModel))] [StringLength(60, ErrorMessageResourceName = "EmailStringLengthErrorMessage", ErrorMessageResourceType = typeof(Resources.Languages.Models.RegistrationValidateModel))] [Display(Name = "EmailDisplayName", ResourceType = typeof(Resources.Languages.Models.RegistrationValidateModel))] [RegularExpression(@".+@.+\..+", ErrorMessageResourceName = "EmailInvalidRegularExpressionErrorMessage", ErrorMessageResourceType = typeof(Resources.Languages.Models.RegistrationValidateModel))] public string Email { get; set; } </code></pre> <p>View</p> <pre><code>@Html.ValidationMessageFor(m => m.Email) </code></pre> <p>Generated HTML</p> <pre><code><input class="span12" data-val="true" data-val-length="You must enter an email address less than 60 characters long" data-val-length-max="60" data-val-regex="You must enter a valid email address" data-val-regex-pattern=".+@.+\..+" data-val-required="You must enter an email address1" id="Email" name="Email" type="text" value="" /> </code></pre> <p>...</p> <pre><code><span class="field-validation-valid" data-valmsg-for="Email" data-valmsg-replace="true"></span> </code></pre> <p>Currently, after validation the hover fails to retrieve the error message</p> <p><img src="https://i.stack.imgur.com/hFqJj.png" alt="enter image description here"></p> <p>However, if you give the control focus and then click the validation warning icon it displays the message (albeit in a slightly different position):</p> <p><img src="https://i.stack.imgur.com/fK7fN.png" alt="enter image description here"></p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload