如何获取ModelState.AddModel错误绑定到knockout动态创建的验证范围?

Gra*_*ler 6 asp.net-mvc jquery-validate asp.net-mvc-3 knockout.js

我已使用以下代码设置Knockoutjs以动态创建可编辑的值列表:

       var requirementModel = function() {
        var self = this;
        self.requirementtypes = ko.observableArray(@Html.Interpret(Model.requirementtypes));
        self.requirementid = ko.observable(@Html.Interpret(Model.requirementid));
        self.AddRequirementType = function() {
            self.requirementtypes.push({
                requirementtypeid: null,
                number: "",
                requirementid: 0
            });
        };
        self.RemoveType = function(Type) {
            self.requirementtypes.remove(Type);
        };
        self.hookUpValidation = function() {
            $.validator.unobtrusive.parseDynamicContent('.dynamicData');
        };
    };
    var viewModel = new requirementModel();
    ko.applyBindings(viewModel);
Run Code Online (Sandbox Code Playgroud)

用html:

 <div class="small-box dynamicData"  data-bind="template:{ name: 'requirementType-template', foreach: requirementtypes, afterRender:$root.hookUpValidation }" ></div>
<button data-bind='click: AddType'>Add Type</button>
Run Code Online (Sandbox Code Playgroud)

我已经使用stackoverflow上推荐的代码连接了动态数据的验证.

当我回发到服务器时(我没有使用JSON只是表格帖子)我可以做更复杂的验证,如果出现问题,我可以使用ModelState.AddModelError("输入字段名称","我可怜的傻瓜打破了这个" ); 对于非动态字段,这适用于强类型或@ Html.ValidationMessage("输入字段名称")

但是我找不到将服务器端模型错误挂钩到动态内容的方法.

我有与客户端一起工作的span标签,它们完美地工作.但是,在服务器端验证失败并返回页面后,它们不会被挂钩.知道如何实现这个吗?

谢谢

pho*_*tom 4

我刚刚完成了我当前工作项目的编码。我无法发布调解规则的代码。就像您上面的评论所说,没有一种优雅的方法。我将描述我们显示错误消息所采取的步骤。

首先,修改动态生成的 html,以便每个 html 都具有与 MVC3 @Html.ValidationFor(...) 控件等效的代码。接下来,每个动态控件都需要有一个 id 字段,您可以使用该字段来定位要添加错误消息的控件。

我采取的步骤是,在控制器收到用于验证的 ajax 数据后开始 -

  1. 验证接收到的数据模型

  2. 创建一个类来返回如下所示的结果

    Class AjaxResults{
        bool success {get; set;);
        object returnedData {get; set;);
    }
    
    Run Code Online (Sandbox Code Playgroud)
  3. 如果模型验证,则返回AjaxResults= successtrue and returnedData=“验证数据模型”

  4. 如果模型无法验证则

  5. 将所有错误收集到一个对的列表中。其中 key = fieldID,value =“错误消息”。
  6. 返回AjaxResults= successfalse 和returnedData=“错误列表”

  7. 客户端收到AjaxResults对象后

  8. 如果success= true,则正常处理结果。

  9. 如果success= false,则迭代列表,突出显示有错误的字段并显示错误消息。

在最后一步中,您可以使用 jquery 验证消息显示错误代码。如果你想这样做,那么在 jquery.unobtrusive.valiation.js 文件中

  1. 添加代码以复制文件中 onError 方法的功能。
  2. 添加代码以通过错误列表进行交互,调用 onError 方法来显示消息。请注意,信息存储在错误消息范围的 .data 属性中。
  3. 您可能需要编写代码来在提交表单时清除所有这些错误。

这是一个相当长的过程。但代码很容易模块化为可调用的例程。我们目前正在我们的生产代码中使用它,并且在实践中,它成为我们框架代码的一部分。

希望这可以帮助。