CODEWITHSUNDEEP
validationasp.net-mvc-4
kb.
kb.

Reputation: 1060

MVC4 client validation not displaying

When I submit my form, The client validation is working, but it is not displaying the error messages for the invalid form fields...

The Model

public class Blog : MainDbContext
{
    public int Id { get; set; }

    [Display(Name="Author")]
    public int Profile { get; set; }

    [Required(AllowEmptyStrings = false, ErrorMessage = "Title is required.")]
    public string Title { get; set; }

    [Required(AllowEmptyStrings = false, ErrorMessage = "At least one Tag is required.")]
    public string Tags { get; set; }
}

The ViewModel

public class BlogEditViewModel
    {
        public BlogEditViewModel(Blog blogItem, IEnumerable<SelectListItem> staffList)
        {
            this.BlogItem = blogItem;
            this.StaffList = staffList;
        }

        public Blog BlogItem { get; set; }
        public IEnumerable<SelectListItem> StaffList { get; private set; }
    }

The View

    <section>
        @Html.LabelFor(model => model.BlogItem.Tags)
        @Html.EditorFor(model => Model.BlogItem.Tags, null, "Tags")  
        @Html.ValidationMessageFor(model => model.BlogItem.Tags)
</Section>

The Layout 

 <script src="/Scripts/jquery-1.7.1.js" type="text/javascript"></script>
 <script src="/Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script>
 <script src="/Scripts/jquery.validate.js" type="text/javascript"></script>
 <script src="/Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script>

The Output (on form submitted)

<input type="text" value="ok" name="Tags" id="Tags" data-val-required="At least one Tag is required." data-val="true" class="text-box single-line input-validation-error">
<span data-valmsg-replace="true" data-valmsg-for="BlogItem.Tags" class="field-validation-valid"></span>

What i expect is the above Span tag to contain the error message as defined n the Model.

The problem I suspect relates to the naming in the EditorFor, as you can see I use an overload to specify the 'htmlfieldname', as without this the form data fails to map the form fields with the model & fails to save the submitted from data.

If I dont use the overloaded EditorFor, the validation works, but as mentioned above the, the form data fails to map the form fields with the model

how do I get the validation to work?

Thanks kb

Upvotes: 0

Views: 190

Answers (1)

Jaimin
Jaimin

Reputation: 8020

Add this script in your View and client side validation is working fine,

<script src="@Url.Content("~/Script/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Script/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

I think issue is you have to remove null, "Tags"

 @Html.EditorFor(model => Model.BlogItem.Tags)

or you have to assign null, "Tags" to

 @Html.ValidationMessage("Tags")

Ex:

View

 @Html.LabelFor(m => m.Name)
                @Html.TextBoxFor(m => m.Name, new { Name="asd"})
                @Html.ValidationMessage("asd")

Model

 public class RegisterModel
    {
  [Required(ErrorMessage = "Name is required.")]
        public string Name { get; set; }
}

Upvotes: 1

Related Questions