如何使用ajax.beginform处理MVC3中的服务器端错误

时间:2011-09-21 14:00:14

标签: asp.net-mvc-3 validation razor

我正在为我的页面使用Ajax.BeginForm。客户端验证执行其工作并在验证摘要区域中显示任何错误。现在,当控制器中发生服务器端错误时,我想要相同的行为。

在标准表单中,您将AddModelError添加到ModelState并返回到表单,并更新字段和验证摘要。但是使用Ajax我无法使用它。

我的控制器返回一个JsonResult(这可能不是正确的方法,但我可以轻松地将我的更新信息返回到表单),我要做的第一件事就是检查ModelState.IsValid。如果这是错误的,那么如何在验证摘要中的页面上显示这些错误?

我返回一个包含字段名称和错误的字典集合并调用此例程,这几乎只是从jQuery中获取:

function ShowFormErrors(validator, errors) 
{
if(errors) {
    // add items to error list and map
    $.extend( validator.errorMap, errors );
    validator.errorList = [];
    var curElement;
    for ( var name in errors ) {
        for( var elm=0; elm<validator.currentElements.length; elm++ )
        {
            if( validator.currentElements[elm].name == name )
            {
                curElement = validator.currentElements[elm];
                break;
            }
        }

        validator.errorList.push({
            message: errors[name],
            element: curElement           //this.findByName(name)[0]
        });
    }
    // remove items from success list
    validator.successList = $.grep( validator.successList, function(element) {
        return !(element.name in errors);
    });
}
validator.settings.showErrors
    ? validator.settings.showErrors.call( validator, validator.errorMap, validator.errorList )
    : validator.defaultShowErrors();

}

此代码有效但永远不会调用validator.settings.showErrors,因为我认为showErrors不在validate.unobtrusive.js中,而是在validate.js中。

我最终在本地设置和清除验证摘要:

function ShowValiationSummaryErrors(validator) 
{
    var frm = validator.currentForm;
    var container = $(frm).find("[data-valmsg-summary=true]"), list = container.find("ul");

    if (list && validator.errorList.length) {
        list.empty();
        container.addClass("validation-summary-errors").removeClass("validation-summary-valid");

        $.each(validator.errorList, function () {
        $(list).append( $("<li />").html(this.message));
        });
    }
}


function ClearValidationSummary()
{
var container = $('form').find('[data-valmsg-summary="true"]');
var list = container.find('ul');

    if (list && list.length)
    {
  list.empty();
        container.addClass('validation-summary-valid').removeClass('validation-summary-errors');
    }
}

1 个答案:

答案 0 :(得分:0)

简单的做法是让控制器操作返回包含表单的部分视图,然后通过注入此新内容来更新DOM。这样会自动显示错误。如果您返回JSON,则必须在JSON字符串中包含此信息,然后手动更新相关部分以显示错误。