How to handle server side errors in MVC3 with ajax.beginform
I am using Ajax.BeginForm for my page. The client side validation does its work and displays any errors in the validation summary area. Now I want same behaivor when a server side error occurs in the controller.
In a standard form you would AddModelError to the ModelState and return to the form and the fields and validation summary are updated. But with Ajax I can't get this to work.
My controller returns a JsonResult (this may not be the correct way, but I can get my update information back to the form easily) and the first thing I do is check for the ModelState.IsValid. If this is false, how do you get those errors to display on the page in the validation summary?
I return a dictionary collection with the field name and error and call this routine, which is pretty much just taken from 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();
}
This code works but will never call validator.settings.showErrors because I don't think that showErrors is in validate.unobtrusive.js but is in validate.js.
I ended up setting and clearing the validation summary locally:
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');
}
}
What would be simple is to have your controller action return a partial view containing the form and then update the DOM by injecting this new contents. This way errors will automatically be shown. If you return JSON you will have to include this information in the JSON string and then manually update the relevant portions to show the errors.
精彩评论