w3resource

ASP.NET MVC: ValidationMessage


In the previous tutorial, we learnt how to implement validation using data annotations which displays error messages in the view. In this tutorial, we will take an in dept view into the ValidationMessage HtmlHelper extension method.

The Html.ValidationMessage() as an extension method is a loosely typed method. It displays a validation message if an error exists for the specified field in the ModelStateDictionary object.

ValidationMessage() Signature

MvcHtmlString ValidateMessage(string modelName, string validationMessage, object htmlAttributes)

The ValidationMessage() can be overloaded just like other methods in C#, to find more about these overloads visit MSDN .

Consider the following Activity Model:

//Example: ValidationMessage
@model Activity  
@Html.Editor("ActivityName") <br />
@Html.ValidationMessage("ActivityName", "", new { @class = "text-danger" })

In the above example, the first parameter in the ValidationMessage method is a property name for which we want to show the error message that is: ActivityName. The second parameter is for custom error message which we left blank, and the third parameter is for html attributes and CSS classes.

The ValidationMessage() method will only display an error, if a DataAnnotations attribute is specified on the model property in the model class. The following is a Activity model class where the DataAnnotations attribute "Required" is applied to the ActivtyName property.

Example: Activity Model
public class Activity
{
    public int Id {get; set;}
    [Required]
    public string ActivityName {get; set;}
    public int Status {get; set;}
}

The above code will generate following html.

<input id="ActivityName" 
        name="ActivityName" 
        type="text" 
        value="" />

<span class="field-validation-valid text-danger" 
        data-valmsg-for="ActivityName" 
        data-valmsg-replace="true">
</span>

Now, when the user submits a form without entering a ActivityName, then ASP.NET MVC uses a data- attribute of Html5 for the validation and a default validation message will be injected, when the validation error occurs, as shown below.

Html with Validation message:

<span class="field-validation-error text-danger" 
            data-valmsg-for="ActivityName" 
            data-valmsg-replace="true">The ActivityName field is required.</span>

Custom Error Message

You can display your own error message instead of the default error message as shown above. You can provide a custom error message either in the DataAnnotations attribute or ValidationMessage() method.

In the code snippets below, we will illustrate how to provide a custom error messages using DataAnnotations and also by using the validation message.

Example: Custom error message in the Model

public class Activity
{
    public int Id { get; set; }
    [Required (ErrorMessage ="Please enter an activity name.")]
    public string ActivityName { get; set; }
    public int Status { get; set; }
}

Also, you can specify a message as a second parameter in the ValidationMessage() method as shown below.

//Example: Custom error message
@model Activity   
@Html.Editor("ActivityName") <br />
@Html.ValidationMessage("ActivityName", "Please enter an activity name.", new { @class = "text-danger" })


Inviting useful, relevant, well-written and unique guest posts