【问题标题】:MVC3 - client side validationMVC3 - 客户端验证
【发布时间】:2012-04-23 21:43:02
【问题描述】:

即使文本区域为空白,我的表单也会发布到操作。在发布操作中,我将其设为 null。

另外,我有一个 DI、存储库和服务架构。

我遵循了以下方法,但仍然没有运气。

MVC3 client validation not working

这是我目前所拥有的:

商业实体

namespace Intranet.BusinessEntities
{
    public partial class AnnualReportMessage
    {
        public string Message { get; set; }   
        public int AnnualReportYear { get; set; }
        public string Fice { get; set; }
    }
}

**Following is in Validations Folder**

using System.ComponentModel.DataAnnotations;

namespace Intranet.BusinessEntities
{
    [MetadataType(typeof(AnnualReportMessageMetaData))]
    public partial class AnnualReportMessage
    {
        private class AnnualReportMessageMetaData
        {
            [Required]
            public string Message { get; set; }
        }
    }
}

布局中引用了以下2

<script type="text/javascript" src="@Url.Script("jqueryMain/jquery.validate.js")"></script>
<script type="text/javascript" src="@Url.Script("jqueryMain/jquery.validate.unobtrusive.min.js")"></script>

Wen.config(全局,而非特定区域)

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

页面上的 HTML,我只需要“消息”,为什么我看到其他字段的验证?

<form action="/Sales/AnnualReportNote" id="AnnualReportMessage" method="post">
    <input name="__RequestVerificationToken" type="hidden" value="Q65zfJU+oSODE+qLj0Q0UpfaTId+ENEr+jucyhjWLbk1gnxY0QuTpu7R/lYOGtSxOYJwQkiPryCzgiTekyGikT/YrLQjF6hZXBhKkSF+UVzeAX2PuDrRoJR0pmWf5thL05LlAidHJtRcC3SHHGbxce5dqHSd1zIFpdQfQ3HPu10eUh55jMD4bn0cZeLReJ4P" />
    <input id="Fice" name="Fice" type="hidden" value="XXXXXX" />
    <input data-val="true" data-val-number="The field SetupYear must be a number." data-val-required="The SetupYear field is required." id="SetupYear" name="SetupYear" type="hidden" value="2012" />
    <input data-val="true" data-val-number="The field AnnualReportYear must be a number." data-val-required="The AnnualReportYear field is required." id="Message_AnnualReportYear" name="Message.AnnualReportYear" type="hidden" value="2012" />
    <input id="Message_Fice" name="Message.Fice" type="hidden" value="XXXXXX" />

    <textarea cols="70" data-val="true" data-val-required="The Message field is required." id="Message_Message" name="Message.Message" rows="12">
    </textarea>    

    <div class="distanceBottom"><span class="field-validation-valid" data-valmsg-for="Message.Message" data-valmsg-replace="true"></span></div>

    <input type="image" src="/App_Themes/Main/Images/ResponseAction/Buttons/btn_submit.gif" class="distanceTop" alt="Submit" id="SubmitButton" />
</form>

JavaScript

formSubmit: function ($form, currentForm) {
        if ($form.validate().form()) {
            var $button = $("#" + AnnualReportSpecialEcMessage.enums.submitButtonId);

            jMessage("Processing request...", $button, true, false);
            $.ajax({
                cache: false,
                url: currentForm.action,
                type: currentForm.method,
                data: $form.serialize(),
                error: function (xhr, ajaxOptions, thrownError) {
                    jMessageError(xhr.responseText, $button, false, true);
                },
                success: function (result) {
                    if (result.IsError) {
                        jMessageError(result.Message, $button, false, true);
                    }
                    else {
                        jMessageOK(result.Message, $button, false, false);
                        jMessageHideInterval(3000); //hide after 3 seconds
                    }
                }
            });
        }
    }

我错过了什么吗?

【问题讨论】:

  • 是渲染出来的 HTML 还是实际的 HTML?
  • 我有点惊讶它甚至可以编译,将您的元数据类作为私有嵌套类。
  • FireFox 行为正常。是 IE 8 遇到了这个问题...

标签: asp.net-mvc-3 validation jquery-validate


【解决方案1】:

我认为你需要这样做:

[MetadataType(typeof(AnnualReportMessage.AnnualReportMessageMetaData))] 

您是否有不同的 AnnualReportMessageMetaData 类?

【讨论】:

  • 没有。我已将其更改为公开,但效果仍然相同。另外,我现在不包括 2 个项目。当我查看呈现的 html 时,fice 和 AnnualReportYear 具有值,但这些帖子为 null 和 0。 [MetadataType(typeof(AnnualReportMessageMetaData))] public partial class AnnualReportMessage { [Bind(Exclude = "AnnualReportYear,Fice")] public class AnnualReportMessageMetaData { [Required(ErrorMessage = "Message cannot be empty")] public string Message { get;放; } } }
  • 我已经更改了元数据并将嵌套的元数据类公开,但它仍然在做同样的事情。我现在感到困惑的另一件事是 1. 为什么我需要第二个隐藏字段。 2. 绑定排除的项目,一个被呈现为不需要的,而另一个被呈现为需要的。 3. 在发布的表单上,Message_Fice 为空,MEssage_AnnualReportYear 为 0,因为这两个都有值。
  • [MetadataType(typeof(AnnualReportMessage.AnnualReportMessageMetaData))] public partial class AnnualReportMessage { [Bind(Exclude = "AnnualReportYear,Fice")] public class AnnualReportMessageMetaData { [Required(ErrorMessage = "消息不能为空")] 公共字符串消息 { 获取;放; } } }
  • FireFox 运行正常,是 IE 8 出现问题。 FF 仍然存在未正确传递隐藏字段 Message_Fice 和 Message_AnnualReportYear 的问题。在 FF 中验证是可以的。
【解决方案2】:

使用这个。它将删除 mvc 3 razor 中的默认验证方法。

 $(document).ready(function () {
   var form = $('#formId').get(0);
   $.removeData(form, 'validator');
 });

然后你的 jquery 验证代码将起作用

【讨论】:

  • 不,IE 8 没有表现。 FF 和 IE9,它们显示验证消息并发布表单。
【解决方案3】:

是 jquery.validate.js 有问题。要么获取最新的,要么

替换

return $([]).add(this.currentForm.elements)
.filter(":input")

return $(':input', this.currentForm)

完整的工件

elements: function() {
            var validator = this,
                rulesCache = {};

            // select all valid inputs inside the form (no submit or reset buttons)
            // workaround $Query([]).add until http://dev.jquery.com/ticket/2114 is solved
            //return $([]).add(this.currentForm.elements)
            //.filter(":input")
            return $(':input', this.currentForm)
            .not(":submit, :reset, :image, [disabled]")
            .not( this.settings.ignore )
            .filter(function() {
                !this.name && validator.settings.debug && window.console && console.error( "%o has no name assigned", this);

                // select only the first element for each name, and only those with rules specified
                if ( this.name in rulesCache || !validator.objectLength($(this).rules()) )
                    return false;

                rulesCache[this.name] = true;
                return true;
            });
        },

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-06-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-03-06
    相关资源
    最近更新 更多