Remote validation rule for JQuery validation fails (using MVC 2)

I have a fiel开发者_运维百科d in my markup that I want to validate towards the server. My form currently looks like this:

<% using (Html.BeginForm()){ %>
  <%: Html.Serialize("regData", Model)%>
  <div class="RegistrationGroup">
    <p><label for="Account_Email">e-mail</label> <%: Html.EditorFor(x => x.Account.Email) %><span class="ErrorMessage"></span></p>
  </div>
<% } %>

Then in my jQuery script I have the following code:

$("form").validate({
  rules: {
    "Account.Email": {
      required: true,
      email: true
      remote: "Registration/ValidateEmail"
    }
  }
});

In my RegistrationController class, I have the following method:

public string ValidateEmail(string email)
{
  if (email.Contains("oek"))
    return "false";
  return "true";
}

So for testing, this should return false, and fail the validation if the e-mail address have "oek" somewhere inside it.

However, this does not work.

Without the remote part, the required and email rules work as they should, so I know that they are working.

When I add the remote rule, the following steps happen:

• The method on the controller gets called as planned, with the e-mail address as it's parameter.
• The return value from the method it intercepted inside the browser as true or false respectively ( I used Chrome's developers tools to control this).

But the validation does not work as planned at this point, and after the remote call is done, the required and email rules stop working as well. (it does not try to enforce the remote rule until the other rules have passed the validation, which is a good thing of course).

I have also tried to return a JsonResult with true or false, but to no avail.

What am I doing wrong here?

---

public ActionResult ValidateEmail(string email)
{
    if ((email ?? string.Empty).Contains("oek"))
    {
        return Json(false, JsonRequestBehavior.AllowGet);
    }
    return Json(true, JsonRequestBehavior.AllowGet);
}

also you are missing a comma after the email: true rule:

$('form').validate({
    rules: {
        'Account.Email': {
            required: true,
            email: true,
            remote: '@Url.Action("ValidateEmail", "Registration")'
        }
    }
});

or if this is a separate javascript file you could use HTML5 data-* attributes on the email field:

$('form').validate({
    rules: {
        'Account.Email': {
            required: true,
            email: true,
            remote: $('#Account_Email').data('remote-val-url')
        }
    }
});

---

UPDATE:

Full working example. Ensure that the email action parameter is correctly bound in the ValidateEmail action.

Model:

public class MyViewModel
{
    public MyViewModel()
    {
        Account = new Account();
    }
    public Account Account { get; set; }
}

public class Account
{
    public string Email { get; set; }
}

Controller:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View(new MyViewModel());
    }

    [HttpPost]
    public ActionResult Index(MyViewModel model)
    {
        return View(model);
    }

    public ActionResult ValidateEmail(Account account)
    {
        if ((account.Email ?? string.Empty).Contains("oek"))
        {
            return Json(false, JsonRequestBehavior.AllowGet);
        }
        return Json(true, JsonRequestBehavior.AllowGet);
    }
}

View:

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

<% using (Html.BeginForm()) { %>
    <label for="Account_Email">e-mail</label> 
    <%= Html.EditorFor(x => x.Account.Email) %>
    <span class="ErrorMessage"></span>
<% } %>


<script type="text/javascript">
    $('form').validate({
        rules: {
            'Account.Email': {
                required: true,
                email: true,
                remote: '<%= Url.Action("ValidateEmail", "Home") %>'
            }
        }
    });
</script>

---

I found the answer here at last, and it was not my code that was wrong, but the jQuery.Validate plugin version.

I used the Validate plugin that shipped with Visual Studio 2010, and I have upgraded jQuery from version 1.4.1 to 1.5.1 in the same project. The problem is that the Validate plugin that ships with Visual Studio 2010 (version 1.6) is not compatible with jQuery 1.5.1. It mostly is, but not the Ajax based functionality.

So updating jQuery.Validate to 1.8 solved the problem.