The first one is the container li, and the second one is generated by the ValidationMessageFor helper.
Obviously I don't want to replace the content of the outer li as it would remove the inner elements from the DOM. Instead I would only like to get the class="field-validation-error" for design purposes, so I added data-valmsg-replace="false".
But this kills the functionality of the
ValidationMessageFor
html helper (it does not show the validation message) as the javascript checking the data-valmsg-replace="false" attribute in the jquery.validate.unobtrusive.js is like this:
function onError(error, inputElement) { // 'this' is the form element
var container = $(this).find("[data-valmsg-for='" + escapeAttributeValue(inputElement[0].name) + "']"),
replace = $.parseJSON(container.attr("data-valmsg-replace")) !== false;
container.removeClass("field-validation-valid").addClass("field-validation-error");
error.data("unobtrusiveContainer", container);
if (replace) {
container.empty();
error.removeClass("input-validation-error").appendTo(container);
}
else {
error.hide();
}
}
As you can see the replace is a boolean calculated by: $.parseJSON(container.attr("data-valmsg-replace")) !== false;
But the container variable contains 2 elements in my case, so checking container.attr is lousy as only the first element's attribute is checked.
I don't really know where to report this or if there is a better solution to this problem.
SoonDead
Member
2 Points
3 Posts
Broken functionality in jQuery Validate Unobtrusive
Jun 08, 2012 09:58 AM|LINK
I have been experimenting with the technology in the title.
I have a scenario where there is 2 elements with the attribute data-valmsg-for="Email":
<li data-valmsg-for="Email" data-valmsg-replace="false"> @Html.LabelFor(model => model.Email) @Html.EditorFor(model => model.Email) @Html.ValidationMessageFor(model => model.Email) </li>The first one is the container li, and the second one is generated by the ValidationMessageFor helper.
Obviously I don't want to replace the content of the outer li as it would remove the inner elements from the DOM. Instead I would only like to get the class="field-validation-error" for design purposes, so I added data-valmsg-replace="false".
But this kills the functionality of the
ValidationMessageForhtml helper (it does not show the validation message) as the javascript checking the data-valmsg-replace="false" attribute in the jquery.validate.unobtrusive.js is like this:function onError(error, inputElement) { // 'this' is the form element var container = $(this).find("[data-valmsg-for='" + escapeAttributeValue(inputElement[0].name) + "']"), replace = $.parseJSON(container.attr("data-valmsg-replace")) !== false; container.removeClass("field-validation-valid").addClass("field-validation-error"); error.data("unobtrusiveContainer", container); if (replace) { container.empty(); error.removeClass("input-validation-error").appendTo(container); } else { error.hide(); } }As you can see the replace is a boolean calculated by: $.parseJSON(container.attr("data-valmsg-replace")) !== false;
But the container variable contains 2 elements in my case, so checking container.attr is lousy as only the first element's attribute is checked.
I don't really know where to report this or if there is a better solution to this problem.
Please share your thoughts!
UnobtrusiveValidation
notdet
Member
518 Points
78 Posts
Re: Broken functionality in jQuery Validate Unobtrusive
Jun 11, 2012 04:25 AM|LINK
Probably, you'll consider to write you own HTML and validation to walk around.
SoonDead
Member
2 Points
3 Posts
Re: Broken functionality in jQuery Validate Unobtrusive
Jun 11, 2012 03:00 PM|LINK
I edited the jquery.validate.unobtrusive.js and managed to fix the problem.