1

问题

我正在尝试使用 BadRequest(ModelState) 从 ModelState 返回服务端验证错误,但是当我尝试从 xhr.responseText 分配 jQuery ModelState 时,我在 javascript 中收到未定义的错误。我正在使用带有 Microsoft.jQuery.Unobtrusive.Ajax 3.2.3 的 ASP.Net Core 1.0.1。

编码

控制器动作

public async Task<IActionResult> ApplySanction(SanctionViewModel model)
{
    try
    {
        if (ModelState.IsValid)
        {
            //update database
            return RedirectToAction("Details");
        }
        else
        {
            return BadRequest(ModelState);
        }
    }
    catch (Exception ex)
    {
        return StatusCode(500, ex.ToString());
    }
}

查看 (JavaScript)

function AjaxOnFailure(xhr, status, error) {
    console.log(xhr.responseText);

    var errText = "";
    var response = null;
    var errors = [];
    var errorsString = "";
    if (xhr.status == 400) {
        try {
            response = JSON.parse(xhr.responseText);
            console.log(response);
        }
        catch (e) {
            errText = "Error: " + xhr.status + " - " + error;
        }
    }
    if (response != null) {
        var modelState = response.ModelState; //This is returning undefined
        console.log(modelState);
        for (var key in modelState) {
            if (modelState.hasOwnProperty(key)) {
                for (var i = 0; i < modelState[key].length; i++) {
                    errorsString = (errorsString == "" ? "" : errorsString + "<br/>") + modelState[key][i];
                    errors.push(modelState[key][i]);
                }
            }
        }
    }
    if (errorsString != "") { 
        errText = "Validation Error: " + errorsString;
    } 

    console.log(errText);
    var errIcon = "fa fa-exclamation-circle"
    document.getElementById("modalErrorIcon").className = errIcon;
    document.getElementById("modalErrorText").innerHTML = errText;
}

查看(表格)

<form asp-controller="Client" asp-action="ApplySanction" class="form-horizontal" data-ajax="true" data-ajax-method="POST" data-ajax-success="CloseModal(xhr, status, '#sanctionModal')" data-ajax-failure="AjaxOnFailure(xhr, status, error)">
    <div class="modal fade" id="sanctionModal" tabindex="-1" role="dialog" aria-labelledby="sanctionModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h4 class="modal-title" id="sanctionModalLabel">Sanction Reason</h4>
                </div>
                <div class="modal-body">
                    <input type="hidden" asp-for="ID" />
                    <div class="form-group">
                        <div class="col-sm-10">
                            <textarea asp-for="SanctionReason" class="form-control" autofocus></textarea>
                            <span asp-validation-for="SanctionReason" class="text-danger" />
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <div class="text-danger pull-left">
                        <i id="modalErrorIcon" class=""></i>
                        <span id="modalErrorText"></span>
                    </div>
                    <button type="submit" class="btn btn-primary">Save</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                </div>
            </div>
        </div>
    </div>
</form>

结果

Javascript 调试会话

控制台日志

问题

  1. 为什么我的 ajax 响应中未定义 ModelState?

  2. 在服务器端验证后使用 javascript 显示验证错误有什么意义?我问这个是因为我假设我的服务器端验证只有在用户禁用 javascript 时才会启动,因此客户端验证被绕过。因此,javascript 如何执行以显示服务器 ModelState 返回的验证错误,因为它仍然被禁用?

4

0 回答 0