我们最近决定迁移到jquery 1.9.1并且由于我们的项目位于ASP.NET MVC 3 ,因此它具有jquery.validatejquery.validate.unobtrusive 一切工作正常,并且这些脚本与通过属性属性进行的MVC 3验证之间的默认集成运行良好。

但是,自更新以来,我们还必须更新验证脚本,当我们这样做时,那些“即时”添加的规则将停止工作。 但是更奇怪的是,它仅发生在某些属性上。 在其他方面,只需使用$(form).validate({//things to validate})规则即可。

让我给您一些代码来更好地解释它。 这是ViewModel属性(这是一个简化的示例):

[DataType(DataType.Password)]
        [Required(ErrorMessage = "*Required Field")]
        [Remote("ValidatePassword", "Validator", AdditionalFields = "User")]
        public string SenhaAnterior { get; set; }

[HiddenInput]
        public int VerificacaoSeguranca { get; set; }

这是视图

    @using (Html.BeginForm("...", "...", null, FormMethod.Post, new { @id = "formMSenha" }))
        { 
    <div id="container">
    @Html.HiddenFor(model => model.VerificacaoSeguranca, new { @id = "hdSeguranca" })
@Html.ValidationMessageFor(model => model.VerificacaoSeguranca)
    <div>
                    <label>
                        Senha anterior:
                        @Html.PasswordFor(model => model.SenhaAnterior, new { @id = "txtSenhaAnterior" })
                        @Html.ValidationMessageFor(model => model.SenhaAnterior)
                    </label>
                </div>
    </div>
    }

和脚本

//Even if try this, it still doesn't work
$('#formMSenha').validate({
                rules: {
                    hdSeguranca: {
                        min: 4
                    }
                },
                messages: {
                    hdSeguranca: 'Your password lacks security. Try harder'
                }
            });

    //Since this is a partial view, i have to parse the new added form so the validation rules apply
    $.validator.unobtrusive.parse($("#formMSenha"));

                //Minimum security level
                $('#hdSeguranca').rules('add', { min: 4, messages: { min: 'Your password lack security. Try adding more numbers, letters ou symbols.'} });

在更新之前,新的添加规则有效,但现在无效。 就像新规则永远不会被验证程序解析或因为它无法识别。 但是奇怪的是,如果我这样做

('#formMSenha').validate({
                rules: {
                    txtSenhaAnterior: {
                        min: 4
                    }
                },
                messages: {
                    hdSeguranca: 'New test'
                }
            });

$('#txtSenhaAnterior').rules('add', { min: 4, messages: { min: 'Newer teste'} });

验证适用! 我完全不知道为什么。

编辑

正如@Sparky所建议的那样,我正在显示此PartialView的呈现的HTML(它是jquery对话框),并做了一些小的修改。

<div id="msenhaContainer">
<form method="post" id="formMSenha" action="..." novalidate="novalidate">        <h2>
            Atualize sua senha para uma senha complexa</h2>
        <div id="campos">
            <input type="hidden" value="0" name="VerificacaoSeguranca" id="hdSeguranca" data-val-required="The VerificacaoSeguranca field is required." data-val-number="The field VerificacaoSeguranca must be a number." data-val="true">
            <div>
                <label>
                    Senha anterior:
                    <input type="password" name="SenhaAnterior" id="txtSenhaAnterior" data-val-required="*Campo obrigat&amp;#243;rio" data-val-remote-url="/Validator/ValidarSenhaAnterior" data-val-remote-additionalfields="*.SenhaAnterior,*.Usuario" data-val-remote="&amp;#39;SenhaAnterior&amp;#39; is invalid." data-val="true" class="input-validation-error">
                    <span data-valmsg-replace="true" data-valmsg-for="SenhaAnterior" class="field-validation-error"><span for="txtSenhaAnterior" class="">*Campo obrigatório</span></span>
                </label>
            </div>
            <div>
                <label>
                    Nova Senha: <input type="password" name="SenhaNova" maxlength="18" id="txtSenhaNova" data-val-required="*Campo obrigat&amp;#243;rio" data-val="true" class="valid">
                    <span data-valmsg-replace="true" data-valmsg-for="SenhaNova" class="field-validation-valid"></span>
                </label>
            </div>
            <div>
                <label>
                    Nova Senha Confirmação: <input type="password" name="SenhaNovaConfirmacao" maxlength="18" id="txtSenhaNovaConf" data-val-required="*Campo obrigat&amp;#243;rio" data-val-equalto-other="*.SenhaNova" data-val-equalto="As senhas n&amp;#227;o s&amp;#227;o as mesmas" data-val="true" class="valid">
                    <span data-valmsg-replace="true" data-valmsg-for="SenhaNovaConfirmacao" class="field-validation-valid"></span>
                </label>
            </div>
            <br>
            <label>
                Força da Senha</label>
            <div id="progressoSenha" class="ui-progressbar ui-widget ui-widget-content ui-corner-all" role="progressbar" aria-valuemin="0" aria-valuemax="6" aria-valuenow="2">
            <div class="ui-progressbar-value ui-widget-header ui-corner-left" style="display: block; width: 33%; background: none repeat scroll 0% 0% rgb(209, 125, 14);"></div></div>
            <span data-valmsg-replace="true" data-valmsg-for="VerificacaoSeguranca" class="field-validation-valid"></span>
            <div style="text-align: center" id="descricaoForcaSenha">Fraca</div>
            <a id="regrasSenha" href="#" title="Tooltip com as regras aqui!">Regras da senha complexa</a>
        </div>
<input type="hidden" name="freebird" data-val-required="If i stay, will still remember me" id="freebird"></form></div>

<script type="text/javascript">
    //Xhalent's function
    (function ($) {
        $.validator.unobtrusive.parseDynamicContent = function (selector) {
            //use the normal unobstrusive.parse method
            $.validator.unobtrusive.parse(selector);

            //get the relevant form
            var form = $(selector).first().closest('form');

            //get the collections of unobstrusive validators, and jquery validators
            //and compare the two
            var unobtrusiveValidation = form.data('unobtrusiveValidation');
            var validator = form.validate();

            $.each(unobtrusiveValidation.options.rules, function (elname, elrules) {
                if (validator.settings.rules[elname] == undefined) {
                    var args = {};
                    $.extend(args, elrules);
                    args.messages = unobtrusiveValidation.options.messages[elname];
                    //edit:use quoted strings for the name selector
                    $("[name='" + elname + "']").rules("add", args);
                } else {
                    $.each(elrules, function (rulename, data) {
                        if (validator.settings.rules[elname][rulename] == undefined) {
                            var args = {};
                            args[rulename] = data;
                            args.messages = unobtrusiveValidation.options.messages[elname][rulename];
                            //edit:use quoted strings for the name selector
                            $("[name='" + elname + "']").rules("add", args);
                        }
                    });
                }
            });
        }
    })($);
    //DOM ready
    $(function () {
    //Since this is a test, there's no reason to submit the form to the server
        $.validator.setDefaults({
            debug: true
        });

        //Trying to remove the validator to revalidate the form with the new added rule
        $("#formMSenha").removeData("validator").removeData("unobtrusiveValidation");

        $.validator.unobtrusive.parse($("#formMSenha"));

        $('#hdSeguranca').rules('add', { min: 4, messages: { min: 'Your password lacks security'} });

        //Got this example on Xhalent's blog, but it didn't work either
        //        $.validator.unobtrusive.parseDynamicContent($('#hdSeguranca'));

        $.validator.unobtrusive.parse($("#formMSenha"));

        $('#progressoSenha').progressbar({ max: 6, value: 0 });

        $('#txtSenhaNova').keyup(function () {
            VerifyPasswordStrength($(this).val());
        });

        $('#regrasSenha').tooltip({ content: function () {
            //            var texto = $('&lt;div style="display: inline" &gt;&lt;/div&gt;');
            //            texto.html('Regras da senha complexa:');
            //            texto.append("&lt;ul&gt;").append('&lt;li&gt;').append(
            //            $('&lt;span&gt;').html('Deve possuir pelo menos 6 caracteres')).insertAfter($('&lt;li&gt;').append('&lt;span&gt;').html('Deve ter ao menos um número')).
            //            insertAfter($('&lt;li&gt;').append('&lt;span&gt;').html('Deve ter ao menos um caractere especial. Ex:"! @ # $ % &amp;" '));
            //            return texto;

            var textoSenha = $('#descSenha').html();
            return textoSenha;
        }
        });

        $('#formMSenha').submit(function () {
            $.ajax({
                type: 'post',
                url: '...',
                data: $('#formMSenha').serialize(),
                dataType: 'json',
                success: function (data) {
                    $.growlUI('Sucesso', 'Sucesso', 'Flawlessly done!');

                    setTimeout(function () { window.location.replace('/') }, 2000);
                }
            });

            return false;
        });

    });                                   //JQUERY END
    function VerifyPasswordStrength(password) {
        //Removed the security code, but what it does is validate the input
        //to check if the user abide to the safety rules
        //When everything is done, it assigns a value to the hidden var
        //The mininum score required is 4. So if the user don't hit 4 points
        //it can't let him proceed and submit the form
        $('#hdSeguranca').val(passwordScore);

        var progressbar = $("#progressoSenha");
        var progressbarValue = progressbar.find(".ui-progressbar-value");
        var cor = '#9c9999';

        switch (judite) {
            case 1:
                cor = '#790f0f'; //red
                break;
            case 2:
                cor = '#d17d0e'; //orange
                break;
            case 3:
                cor = '#e1e40b'; //yellow  
                break;
            case 4:
                cor = '#129f0a'; //green
                break;
            case 5:
                cor = '#0768c7'; //blue
                break;
            case 6:
                cor = '#92dae8'; //brighter blue
                break;
        }

        progressbarValue.css({ "background": '' + cor });

        $('#progressoSenha').progressbar("option", "value", passwordScore);

        $('#descricaoForcaSenha').html(desc[passwordScore]);
    }

</script>

===============>>#1 票数:0

您尚未显示渲染的HTML,但似乎只是在创建和引用id属性。 您在.validate()内部用于声明规则的字段名称应该输入的name属性匹配而不是 id

为了使此插件正常工作,所有输入元素必须包含唯一的name属性。

HTML

<input type="text" name="myfield" id="something" />

jQuery的

$(document).ready(function() {

    $('#myform').validate({
        rules: {
            myfield: { // <-- this is the NAME attribute
                required: true,
                minlength: 5
            }
        }
    });

});

===============>>#2 票数:0 已采纳

似乎在1.9版之后, 默认情况下 ,验证脚本会忽略隐藏字段验证 所以我尝试添加验证规则是正确的,问题是它已添加到隐藏字段中。

您可以在此处检查更改日志: http : //jquery.bassistance.de/validate/changelog.txt

但是,如果您需要验证隐藏字段,则可以使用以下代码更改脚本忽略

$.validator.setDefaults({ 
    ignore: [],
    // any other default options and/or rules
});

  ask by AdrianoRR translate from so

未解决问题?本站智能推荐:

2回复

ASP MVC4 + JQuery验证不起作用

我按照Internet中的步骤设置密码验证。 我正在使用ASP.NET MVC4 + razor + jquery,但验证似乎不起作用。这是我的代码: CSHTML: JS中的HTML: 和控制器: 当我在调试模式下单击提交按钮时,它会跳转到此索引函数而不进行
4回复

与jQuery验证绑定的单选选项不起作用

我使用knockout将对象列表绑定到select 。 对象类可以包含任意数量的属性 <select id="TheProperty_City" name="TheProperty_City" class="required" da
2回复

Inline Datepicker的不显眼验证不起作用,适用于非内联Datepicker

我没有使用jquery.ui的datepicker,因为我需要在不同条件下选择整周和多个日期,所以我在EditorTemplate中使用Keith Wood的 datepicker作为我的Date字段: 使用文本框并使用日期选择器“弹出”时,验证工作正常; 但我真正想要的是使用内联日期
1回复

万无一失如果IfTrue对MVC5不起作用?

我正在尝试有条件的必填字段。 如果用户选中“ ContactByPhone复选框,则我将显示“ ContactPhoneNumber字段,并且必须填写ContactPhoneNumber字段。 如果用户未选择ContactByPhone则ContactPhoneNumber是不可见的,并且不
2回复

jQuery Validate在MVC C#中不起作用

我正在使用MVC应用程序,需要检查是否已注册用户,为此,我创建了一个模型 到目前为止,我的问题是我需要通过AJAX以JSON格式发送用户信息,并且我需要验证是否指定了用户名和密码信息,以完成此代码的编写: 这是我的表格(上面的代码和表格在同一个文件中:Index.cshtml)
2回复

jquery验证添加规则

我在jquery中使用验证插件。 当我以这种方式添加规则时,有一个非常奇怪的事情 没有添加任何规则。 如果我调试js文件并进入jquery.validation.js文件中的validate方法,我发现传递给validate方法的选项为空。 但是,如果我动态添加规则,就像
2回复

jQuery验证中的规则/属性

我正在尝试将自定义验证添加到动态创建的控件中。 我可以使用.attr()设置控件规则吗? 我想避免的是必须做这样的事情:
1回复

jQuery验证两个规则,只有一个规则是有效的。 可能?

在登录表单上,我可以接受用户ID(数字)或电子邮件地址。 通过添加属性data-rule-number和data-rule-email分别设置这些属性,这将为这些字段连接基本的jQuery验证规则。 但是,我只需要其中之一即可有效。 用户需要输入数字或电子邮件,而不要输入其他任何内容(即a
1回复

jQuery添加规则时验证抛出错误

当我的js页面加载并创建如下所示的规则时,我从jquery.validate.js库第138行引发了错误,该错误表示“无法读取未定义的属性'设置'” 这是我要添加的规则以及我也要添加的表单 $('#zipCodeText').rules("add", { required: tru
1回复

添加jQuery验证规则以进行多选

在我的ASP.NET MVC应用程序中,我有一个带有选择标签的视图,可以选择多个选项。 默认情况下(页面加载时),我的选择中没有任何选项。 通过某些操作,可以在选项中填充选项,并且效果很好。 现在,当我提交表单时,我想检查选择项是否具有任何选项,因为提交表单时要求选择项至少具有一个