Kendo UI MVC Grid - 使用 ajax 和服务器端验证添加新记录或更新记录答案

【问题标题】：KendoUI MVC Grid - Addnew or Update record with ajax and server side validationKendo UI MVC Grid - 使用 ajax 和服务器端验证添加新记录或更新记录
【发布时间】：2012-11-01 19:31:15
【问题描述】：

我已经使用带有 Ajax 绑定的 Knedo UI MVC 网格实现了内联编辑，在控制器中处理服务器端验证并使用 -

将错误发回

ModelState.AddModelError("错误: ", ex.Message);

@(Html.Kendo().Grid<AnalyticsServiceWeb.ViewModel.SomeViewModel>() .Name("Grid") .Columns(columns => { columns.Bound(p => p.Name); columns.Bound(p => p.Path); columns.Bound(p => p.Space); columns.Command(command => { command.Edit(); command.Destroy(); }); }) .ToolBar(toolbar => toolbar.Create()) .Editable(editable => editable.Mode(GridEditMode.InLine)) )

function error_handler(e) {
    if (e.errors) {
        var message = "Errors:\n";
        $.each(e.errors, function (key, value) {
            if ('errors' in value) {
                $.each(value.errors, function () {
                    message += this + "\n";
                });
            }
        });
        alert(message);
    }
}

出现服务器端异常时会显示服务器端错误消息，但它仍会完成 UI 中的操作，我的意思是即使存在服务器端异常，它也会将新记录添加到网格并更新。

有没有办法在动作开始之前保留 UI 的状态？，它应该以这种方式工作，不确定我是否遗漏了什么？

提前致谢

【问题讨论】：

标签： asp.net-mvc kendo-ui

【解决方案1】：

Kendo UI 在您的视图模型中支持（大多数）数据注释，这将为您提供由 Kedno UI 提供的客户端不显眼的验证，您可以通过查看 ModelState 来实现服务器端验证

因此，在您的控制器操作中执行此操作将处理服务器端验证

If(ModelState.IsValid)
{
   //Write to the Database
}
else
{
   //We Have Validation Error, return the model for correction
}

这里有一些例子

[Required]
[DataType.Currency]
public decimal Currency { get; set; }

这告诉网格需要货币字段（显然），但比这更酷的是 Kendo Grid 将在编辑时自动呈现其货币文本框

它会对日期和时间做同样的事情，所以这将呈现它的日期选择器

[Required]
[DataType.Date]
public decimal Date { get; set; }

要显示服务器端验证错误，试试这个：

错误的键包含字段的名称。您可以使用它来生成一条消息，其中包含错误的属性名称，例如

$.each(e.errors, function (key, value) {
    if ('errors' in value) {
        message += key + ":\n";
        $.each(value.errors, function () {
            message += this + "\n";
        });
    }
});

【讨论】：