jQuery Validate的奇怪行为

时间:2017-02-18 17:12:15

标签: javascript jquery jquery-validate

我使用jQuery Validate,当我提交表单时,它只显示一个必填字段,只有在我点击它们时才会显示其他字段,并在下一个字段显示。

这是剧本和正文:

 jQuery(function () {
        $("#form1").validate({
            rules: {
                Yritys: {
                    required: true,
                    minlength: 3
                },
                Henkilönimi: {
                    required: true,
                    minlength: 3
                },
                Asema_yrityksessa: {
                    required: true,
                    minlength: 3
                },
                Puhelin_Nr: {
                    required: true,
                    minlength: 3
                },
                e_Mail: {
                    required: true,
                    minlength: 3
                },
                Keskustelun_aihe: {
                    required: true,
                    minlength: 10
                },
                messages: {
                    Yritys: {
                        required: "You must enter something",
                        minlength: "You must enter more than 3 characters"
                    },
                    Henkilönimi: {
                        required: "You must enter something",
                        minlength: "You must enter more than 3 characters"
                    },
                    Asema_yrityksessa: {
                        required: "You must enter something",
                        minlength: "You must enter more than 3 characters"
                    },
                    Puhelin_Nr: {
                        required: "You must enter something",
                        minlength: "You must enter more than 3 characters"
                    },
                    e_Mail: {
                        required: "You must enter something",
                        minlength: "You must enter more than 3 characters"
                    },
                    Keskustelun_aihe: {
                        required: "You must enter something",
                        minlength: "You must enter more than 10 characters"
                    }
                }
            },

        });

    });


 <div class="divInfo">
        <form id="form1">
            <span>Yritys:</span><br />
            <input id="Yritys" type="text" required /><br />
            <span>Henkilönimi:</span><br />
            <input id="Henkilönimi" type="text" required /><br />
            <span>Asema yrityksessa:</span><br />
            <input id="Asema_yrityksessa" type="text" required /><br />
            <span>Puhelin Nr:</span><br />
            <input id="Puhelin_Nr" type="text" required /><br />
            <span>e-Mail:</span><br />
            <input id="e_Mail" type="text" required /><br />
            <span>Keskustelun aihe:</span><br />
            <textarea id="Keskustelun_aihe" maxlength="140" style="width:300px;height:150px;" required>Enter Text Here...</textarea><br />
            <span style="color:red; margin-left:0;">Keskustelun aihe max 140 merkkia</span>
            <div id="textarea_feedback" style="opacity:0.5"></div>
            <div class="butt"><pre style="font-size:x-large">Vahvista varaus klikkamalla tässä>>>>>>>>>>>>><button id="submit" type="submit" name="appointment" value="" class="btn-warning" /></pre></div>

        </form>
    </div>

为什么会这样?它有效,但它无法正常工作。我无法找到解决方案。

修改

发生这种情况:

enter image description here

1 个答案:

答案 0 :(得分:1)

  

为什么会这样?它有效,但它无法正常工作......

必须在每个考虑进行验证的输入上都有name属性,而name是唯一可以从rules对象引用的内容.validate()

$("#form1").validate({
    rules: {
        Yritys: {      // <- this must be the NAME
            required: true,
            minlength: 3
        },
        Henkilönimi: { // <- this must be the NAME
            ....
  

......我无法找到解决方案

Official Documentation: Markup recommendations -

  

授权 :A&#39; name&#39;需要验证的所有输入元素都需要该属性,如果没有此属性,插件将无效

您还意外地将messages对象放在rules内,这应该是兄弟姐妹。

$("#form1").validate({
    rules: {
        ....
    },
    messages: {
        ....
    }
});

DEMO jsfiddle.net/2o9Lxkej