Use Remote validation in ASP.NET MVC without form on View

Question

I use Remote attribute on my ViewModel in ASP.NET MVC 4 application. Here is my simple model:

public class User
{
    [Required(AllowEmptyStrings = false, ErrorMessage = "test test")]
    public int Id { get; set; }

    [DisplayName("Email")]
    [Remote("RemoteValidateEmailLengthValidation", "Home")]

    public string Email { get; set; }
}

And remote validation method:

public JsonResult RemoteValidateEmailLengthValidation(string Email)
{
    if (Email.Length > 20)
    {
        return Json("Too long email", JsonRequestBehavior.AllowGet);
    }
    else
    {
        return Json(true, JsonRequestBehavior.AllowGet);
    }
}

I added all scripts that i need for validation on Layout :

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")
@Scripts.Render("~/bundles/jqueryval")

Write all that i need for validation in WebConfig :

<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />

And add simple Controller that creates empty model and return View .

@model ViewModels.User

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@using (Html.BeginForm("PostUser", "Home", FormMethod.Post))
{
    @Html.EditorForModel()
    <input type="submit" />
}

It works only if i wrap my model in form and doesn't work if i write my View like this:

@model ViewModels.User

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@Html.EditorForModel()

So i have questions:

1. Why remote validation doesn't work without form? Because in Chrome debugger i see that form don't submit i see only Validation method call.
2. Which javascript method used by Remote validation? OnChange ? Can i see it anywhere and can i change it?

Answer 1

Client side unobtrusive validation involves

1. On the server side: All HtmlHelper used for generating form controls internally call the GetUnobtrusiveValidationAttributes method of HtmlHelper . Various checks are performed and if not all conditions are met (such as UnobtrusiveValidation has been disabled) then the data-val attributes necesary for client side validation are not rendered
2. On the client side: When jquery.validation.unobtrusive.js is loaded, it first checks for the existence of a <form> tag, then based on the data-val attributes, add the rules,messages etc. for use by jquery.validate .

The first function called is

parse: function (selector) {
    var $forms = $(selector)
        .parents("form")
        .andSelf()
        .add($(selector).find("form"))
        .filter("form");
    ....

where selector is the html document element. If there is no <form> element, var $forms is undefined and nothing more is executed. Client side validation simply does not work if there is no <form> element.

Its unclear why you would generate html form controls that are not in a form, but you could simply make your own call to the controller function, return a message and display it

public JsonResult RemoteValidateEmailLengthValidation(string Email)
{
    if (Email.Length > 20)
    {
        return Json("Too long email", JsonRequestBehavior.AllowGet);
    }
    else
    {
        return Json(null, JsonRequestBehavior.AllowGet);
    }
}

and the script

var url = '@Url.Action("RemoteValidateEmailLengthValidation", "Home")';
var placeHolder = $('[data-valmsg-for="Email"]');
$('#Email').change(function() {
  $.getJSON(url, { Email: $(this.val() }, function(response) {
    if(response) {
      placeHolder.text(response).removeClass('field-validation-valid').addClass('field-validation-error');
    }
  });
});

and also handle the .keyup event to remove error message and reset the class name

Answer 2

Cant find JsonRequestBehavior in aspnet 5

[HttpGet]
public JsonResult IsAllowedName(string FirstMidName)
{
    if (FirstMidName.ToLower() == "oleg")
    {

        //It seems that Microsoft.Asp.Net.Mvc does 
        //not contain JsonRequestBehavior enum
        return Json(false, JsonRequestBehavior.AllowGet); 
    }
    return Json(true);
}

Terminal output

dnu build
/.../Controllers/ValidationController.cs(20,24):
DNXCore,Version=v5.0 error CS0103: 
The name 'JsonRequestBehavior' does not exist in the current context
Build failed.