Orchard CMS DataAnnotations - 客户端验证

Question

我试图在 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 源（更不用说我有时可能需要本地化消息）...

Answer 1

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

我还使用 LocalizedRequiredAttribute，正如您在那些自动生成的元数据模型中看到的那样。

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

有两个困难：

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

第二：您必须（重新）解析表单以获得有效的不显眼的验证

您将在这里找到完整的 基于 JQuery 对话框的表单 使用不显眼的验证并聚焦行 $.validator.unobtrusive.parse(form);
这使得分析 ajax 添加的控件变得不那么引人注目。

在JQuery常用工具框中查找$.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();
}

Answer 2

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

 @model ABC.Models.ModelName
@{


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

在模块“Scripts”文件夹中添加“jquery.validate.min.js,jquery.validate.unobtrusive.min.js”。

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

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