Orchard CMS DataAnnotations - 客户端验证答案

【问题标题】：Orchard CMS DataAnnotations - Client-side validationOrchard CMS DataAnnotations - 客户端验证
【发布时间】：2012-02-28 23:36:58
【问题描述】：

我正在尝试在 Orchard 模块中进行不显眼的客户端验证，但我遇到了问题。

在此示例中，我只是尝试使用 Html.TextBoxFor() 在文本框字段上强制执行 RequiredAttribute。

在我看来，Orchard 实现的自定义 ModelValidatorProvider (LocalizedModelValidatorProvider) 阻止了 HTML5 输入属性的呈现，具体来说：

data-val
data-val-required

用于标准 DataAnnotations 的RequiredAttribute。 jQuery.validate.unobtrusive 需要这些属性才能工作。

LocalizedModelValidatorProvider 将一个RequiredAttribute 映射到一个LocalizedRequiredAttribute，因此在为装饰有LocalizedRequiredAttribute 的模型属性呈现文本框输入时，这可能是Orchard ViewEngine 中的一个错误（或未实现的功能）？

我怀疑这不会发生：

tagBuilder.MergeAttributes(htmlHelper.GetUnobtrusiveValidationAttributes(name, metadata));

（来自 System.Web.Mvc.Html.InputExtensions）

我目前正在运行 Orchard 1.3.9。

注意： 一个 hacky 解决方法是删除 OrchardStarter 模块中 LocalizedModelValidatorProvider 的注册，并默认返回标准 MVC 3 提供程序，尽管我不想打扰 Orchard 源，如果在一切可能（更不用说我可能在某些时候需要本地化消息）......

【问题讨论】：

这个问题解决了吗。我在实现这一目标时遇到了同样的问题。
不是我的 - 虽然值得注意的是，这是在将近一年前的版本 1.3.9 中 - 它可能已在以后的版本中得到修复。上面描述的解决方法最终对我来说没问题，所以没有追求它 - 我可能应该提出一个错误......
为什么不试试 offorms，它具有内置的动态表单生成功能，它具有您可以定义的内置验证策略。 gallery.orchardproject.net/List/Modules/Orchard.Module.oforms

标签： asp.net-mvc-3 jquery-validate data-annotations orchardcms unobtrusive-validation

【解决方案1】：

我花了 3 周的时间来解决 MyPrettyCMS 中对话框中使用的不显眼验证问题。

我也使用 LocalizedRequiredAttribute，正如你在 AutoGenerated MetaDataModels 中看到的那样。

我不了解 Orcad，但我认为它像我一样将用户表单呈现为 JQuery 对话框。

有两个困难：

第一个：您必须（重新）将对话框字段附加到您将用于将数据发送到服务器的表单。

第 2 次：您必须（重新）解析表单以获得有效的非干扰性验证

你会在这里找到一个完整的JQuery Dialog based Form 使用不显眼的验证并关注 $.validator.unobtrusive.parse(form); 这迫使不显眼地分析 ajax 添加的控件。

在JQuery common tool box中查看$.fn.jqDialogFunction

$.fn.jqDialogFunction = function (idDiv, titre, okFunction, openFunction) {
    var dialogBox = $(idDiv)
    //$(dialogBox).removeClass("notDisplayed");
    $(dialogBox).hide();
    $(dialogBox).dialog({
        title: titre,
        autoOpen: false,
        resizable: false,
        modal: true,
        minHeight: 450,
        minWidth: 800,
        open: openFunction,
        buttons: [
    {
        text: "Ok",
        click: okFunction
    }
            ,
            {
                text: "Cancel",
                click: function () {
                    $(this).dialog("close");
                }
            }
    ]
    });
    var form = dialogBox.find("form");
    if (form != null) {
        $.validator.unobtrusive.parse(form);
    }
    $(idDiv).dialog('open');
}

然后看方法 $.fn.SaveContent -->$("#divStructurePage").parent().appendTo(form);

$.fn.SaveContent = function () {
    $(this).dialog("close");
    var content = tinyMCE.activeEditor.getContent();
    $("#hidNewContent").val(content);
    var v = $("#StructurePage_FK_LayoutMenu_Translation").val();
    var form = $("#frmManagedContent");
    $("#divStructurePage").parent().appendTo(form);
    form.attr("action", "/"+ $("#hidControllerName").val() +"/Save/" + v);
    form.submit();
}

【讨论】：

【解决方案2】：

在您的编辑器模板视图中添加此代码

 @model ABC.Models.ModelName
@{


Script.Require("jQuery").AtHead();
Script.Include("jquery.validate.min.js").AtHead();
Script.Include("jquery.validate.unobtrusive.min.js").AtHead(); }

在您的模块“脚本”文件夹中添加“jquery.validate.min.js,jquery.validate.unobtrusive.min.js”。

在 Web.cofig 文件中添加以下设置。

<appSettings>
<add key="ClientValidationEnabled" value="true"/>
<add key="UnobtrusiveJavaScriptEnabled" value="true"/>
</appSettings>

【讨论】：