AJAX错误返回ModelState错误

时间:2017-05-31 16:38:56

标签: ajax asp.net-mvc asp.net-web-api

在我的创建页面上,我在创建人时使用ajax并调用我的api控制器:

<script>
    $(document).ready(function() {
        var newUrl = '@Url.Action("Index", "PersonInformations")';

        var settings = {};
        settings.baseUri = '@Request.ApplicationPath';
        var infoGetUrl = "";
        if (settings.baseUri === "/ProjectNameOnServer") {
            infoGetUrl = settings.baseUri + "/api/personinformations/";
        } else {
            infoGetUrl = settings.baseUri + "api/personinformations/";
        }

        $("#Create-Btn").on("click",
            function(e) {
                $("form").validate({
                    submitHandler: function () {
                        e.preventDefault();

                        $.ajax({
                            method: "POST",
                            url: infoGetUrl,
                            data: $("form").serialize(),
                            success: function () {
                                toastr.options = {
                                    onHidden: function () {
                                        window.location.href = newUrl;
                                    },
                                    timeOut: 3000
                                }
                                toastr.success("Individual successfully created.");
                            },
                            error: function (jqXHR, textStatus, errorThrown) {
                                var status = capitalizeFirstLetter(textStatus);
                                var error = $.parseJSON(jqXHR.responseText);
                                //console.log(jqXHR.responseText);
                                toastr.error(status + " - " + error.message);
                            }
                        });
                    }
                });
            });

        function capitalizeFirstLetter(string) {
            return string.charAt(0).toUpperCase() + string.slice(1);
        }
    });
</script>

以下是PersonInformations API控制器中的方法:

    [ResponseType(typeof(PersonInformation))]
    public IHttpActionResult PostPersonInformation(PersonInformation personInformation)
    {
        if (!ModelState.IsValid)
        {
            return BadRequest(ModelState);
        }

        var lstOfPersons = db.PersonInformations.Where(x => x.deleted == false).ToList();

        if (lstOfPersons.Any(
                x =>
                    x.FirstName == personInformation.FirstName && x.LastName == personInformation.LastName &&
                    x.AId == personInformation.AgencyId && x.ID != personInformation.ID))
        {
            ModelState.AddModelError("", "This person already exists!");
            return BadRequest(ModelState);
        }

        if (
            lstOfPersons.Any(
                x => x.Email.ToLower() == personInformation.Email.ToLower() && x.ID != personInformation.ID))
        {
            ModelState.AddModelError(personInformation.Email, "This email already exists!");
            return BadRequest(ModelState);
        }

        personInformation.FirstName = CultureInfo.CurrentCulture.TextInfo.ToTitleCase(personInformation.FirstName);
        personInformation.LastName = CultureInfo.CurrentCulture.TextInfo.ToTitleCase(personInformation.LastName);

        db.PersonInformation.Add(personInformation);
        db.SaveChanges();

        return CreatedAtRoute("DefaultApi", new { id = personInformation.ID }, personInformation);
    }

现在,当我对此进行测试并故意输入已存在的电子邮件时,ajax请求错误输出但返回消息:

  

错误 - 请求无效

但是当我使用console.log(jqXHR.responseText)

我明白了:

Create
{
  "$id": "1",
  "message": "The request is invalid.",
  "modelState": {
    "$id": "2",
    "test@test.com": [
      "This email already exists!"
    ]
  }
}

如何将"This email already exists!"作为错误消息?

1 个答案:

答案 0 :(得分:0)

我只想出了这个。我知道modelState是数组类型,第二个值是输入的实际电子邮件地址。

所以我编辑了我的button.click事件:

$("#Create-Btn").on("click",
    function(e) {
        $("form").validate({
            submitHandler: function () {
                e.preventDefault();

                var emailValue = $("#Email").val();

                $.ajax({
                    method: "POST",
                    url: infoGetUrl,
                    data: $("form").serialize(),
                    success: function () {
                        toastr.options = {
                            onHidden: function () {
                                window.location.href = newUrl;
                            },
                            timeOut: 3000
                        }
                        toastr.success("Individual successfully created.");
                    },
                    error: function (jqXHR, textStatus, errorThrown) {
                        var status = capitalizeFirstLetter(textStatus);
                        var error = $.parseJSON(jqXHR.responseText);
                        toastr.error(status + " - " + error.modelState[emailValue]);
                    }
                });
            }
        });
    });

通过数组括号表示法查找错误消息,并获取尝试提交的电子邮件的实际值。