Проверка модели в Asp. Net Core перед выполнением вызова Ajax из сценария java

Question

Ниже приведен пример кода, я вызываю этот код при нажатии кнопки. У меня вопрос, могу ли я проверить свой объект viewmodel перед выполнением вызова ajax? Я вижу ошибки модели в скрипте java, не знаю, как проверить. Мои свойства класса viewmodel имеют атрибуты валидатора аннотации данных. Я не хочу вызывать ajax, если модель представления недопустима, хочу проверить (ModelState.IsValid) в java коде сценария, прежде чем ajax вызвать. Любая помощь, будет принята с благодарностью.

$(function () {
    $("#btnGet").click(function () {
        var viewModelobject = {};
        viewModelobject.Name = $("#txtName").val();
        $.ajax({
            type: "POST",
            url: "/Home/AjaxMethod",
            data: viewModelobject,
            contentType: "application/json",
            dataType: "json",
            success: function (response) {
                alert("Hello")
            }
        });
    });
}

Answer 1

ModelState.IsValid - это код на стороне сервера. Браузер не знает, что это такое, поэтому вы не можете проверить ModelState на стороне клиента. Вы можете использовать Jquery Validation на стороне клиента.

Вот рабочая демонстрация:

1.Модель:

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

2.View (Index.cs * 1023) *):

@model UserModel
<form id="frmContact">
    <div asp-validation-summary="ModelOnly" class="text-danger"></div>
    <div class="form-group">
        <label asp-for="Name" class="control-label"></label>
        <input asp-for="Name" id="txtName" class="form-control" />
        <span asp-validation-for="Name" class="text-danger"></span>
    </div>
    <div class="form-group">
        <button type="submit" class="btn btn-secondary" id="btnGet">Click</button>
    </div>
</form>
@section Scripts
{
    @*you could also add this partial view*@
    @*@{await Html.RenderPartialAsync("_ValidationScriptsPartial");}*@ 

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.1/jquery.validate.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validation-unobtrusive/3.2.6/jquery.validate.unobtrusive.min.js"></script>
    <script>
        $(function () {
            $('#btnGet').click(function () {
                if ($("#frmContact").valid()) {
                    $('#frmContact').submit();
                }
                else {
                    return false;
                }
            });

            $("#frmContact").on("submit", function (event) {
                event.preventDefault();
                var viewModelobject = {};
                viewModelobject.Name = $("#txtName").val();
                $.ajax({
                    type: "POST",
                    url: "/Home/AjaxMethod",
                    data: JSON.stringify(viewModelobject),
                    contentType: "application/json",
                    dataType: "json",
                    success: function (response) {
                        alert("Hello")
                    }
                });
            });
        })
    </script>
}

3. Контроллер:

public class HomeController : Controller
{
    public IActionResult Index()
    {
        return View();
    }
    [HttpPost]
    public IActionResult AjaxMethod([FromBody]UserModel user)
    {
        //do your stuff...
        return Json(user);
    }
}

Результат:

Answer 2

Пожалуйста, используйте jQuery форму подтверждения, как показано ниже внутри обратного вызова кнопки:

var form = $('form[name="' + formName + '"]');
form.validate();
if (form.valid()) {
  //Do something if the form is valid
} 
else {
  //Show validation error messages if the form is in-valid
}