0

My views have limited space for validation messages and because of this i want to output a asterisk instead of the validation message. The following blog outlines how to do this by adding a extra parameter to the validation helper:

http://www.erroronlineone.com/2011/09/12/mvc3-display-an-asterisk-for-error-message/

@Html.ValidationMessageFor(model => model.Name, "*")

But I want to output a asterisk or an image and using the HTML title attribute have a pop up displaying the validation message. Would I have to change the way unobtrusive validation works? Or do you have a better idea? Thanks

1
  • I've posted how I did it here - not sure I've done it the best way, but have asked the question.
    – Dale K
    May 31, 2020 at 20:48

1 Answer 1

0

One way, if you are game, is to edit the unobtrusive validation javascript file.

The error message is displayed in the onError function. Here you can change the message element any way you wish. For example (unminified):

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();

        // Set the "title" attribute and change the text to an asterisk.
        error.prop("title", error.text());
        error.text("*");
        error.removeClass("input-validation-error").appendTo(container);
    }
    else {
        error.hide();
    }
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.