2

by default MVC use jquery unobtrusive validation lib to show validation message at client side. suppose i have small form with two textbox for first name and last name. when click submit button then client side validation will fire and display all validation message at once. but i want to display validation message one by one. now tell me where to customize the code and what code need to add or modify in js to make it possible.

here is my small sample code

namespace MVC_myfirst_Mvcapplication.Models
{
    public class Person
    {
        public int ID { get; set; }

        [Required]
        [StringLength(30)]
        public string First { get; set; }

        [Required]
        [StringLength(30)]
        public string Last { get; set; }
        public DateTime Birthdate { get; set; }
    }

    public class PersonContext : DbContext
    {
        public DbSet<Person> People { get; set; }

    }

}

Controller : PersonController.cs

public class PersonController : Controller
    {
        PersonContext db = new PersonContext();
        //
        // GET: /Person/

        public ActionResult Index()
        {
            var People = db.People.ToList();
            return View(People);
        }

        //
        // GET: /Person/Create

        public ActionResult Create()
        {
            return View();
        } 

        //
        // POST: /Person/Create

        [HttpPost]
        public ActionResult Create(Person Person)
        {

            db.People.Add(Person);
            db.SaveChanges();
            return RedirectToAction("Index");
        }


    }

View:

@model MVC_myfirst_Mvcapplication.Models.Person

@{
    ViewBag.Title = "Create";
}

<h2>Create</h2>

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

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Person</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.First)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.First)
            @Html.ValidationMessageFor(model => model.First)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Last)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Last)
            @Html.ValidationMessageFor(model => model.Last)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Birthdate)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Birthdate)
            @Html.ValidationMessageFor(model => model.Birthdate)
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

tell me which code i need to change in js to show validation message one-by-one in a specific div? thanks

2
  • 1
    You can use jquery to validate individual elements using $("form").validate().element(someElement); and test .valid() - refer this answer for an example (but why would you want to do this?) Commented Dec 21, 2015 at 11:55
  • whatever your said...can u redirect me to right article so i can read and can see how to write code to handle this. Commented Dec 22, 2015 at 11:01

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.