如何使用parsley js仅验证选定的字段

Question

我在一个页面中以两种形式使用parsley js.当我点击type ='button'字段并验证第一个表单只检查表单的3个字段时,我想触发欧芹验证器.最初,表格中包含大约7个字段用于验证.到目前为止,我无法使其发挥作用.试过这个, 但没有运气.

任何的想法？

更新:这是我的代码;

<div class = 'two'>
    <input type='text' id='firstname' name='firstname' />
</div>
$('#form').parsley({
    excluded: '.two input'
});
$('#form').parsley('validate');

我只是试图排除一个字段并测试表单是否正在验证,因为我想要它.但它仍然验证了css类'two'中的输入字段.这就是我到目前为止所做的一切.没有线索..

Answer 1

您的代码存在一些问题,特别是此行:

<dir classs = 'two'>

那应该是

<div class = 'two'>

也就是说,你拥有dir的,而不是div和classs代替class.你也应该用$('#form').parsley().validate()而不是$('#form').parsley('validate').

以下代码将起作用:

<form method='post' id='form'>
    <div class = 'two'>
        <input type='text' id='firstname' name='firstname' required />
    </div>
    <div>
        <input type='text' id='thisisrequired' name='thisisrequired' required />
    </div>
    <button type="button" id="submit-form">Submit</button>
</form>

<script>
    $(document).ready(function() {
        $('#form').parsley({
            excluded: '.two input'
        });

        $("#submit-form").on('click', function() {
            $('#form').parsley().validate();
            if ($('#form').parsley().isValid()) {
                console.log('valid');
            } else {
                console.log('not valid');
            }
        });
    });
</script>

您可以在此jsfiddle中查看更完整的工作示例

对于您的情况,您应该考虑使用data-parsley-group(请参阅文档)以获得相同的结果,使用以下代码:

<form method='post' id='form'>
    <div>
        <input type='text' id='firstname' name='firstname' data-parsley-group="first" 
            required />
    </div>
    <div>
        <input type='text' id='thisisrequired' name='thisisrequired' 
            data-parsley-group="second" required />
    </div>
    <button type="button" id="submit-form">Submit</button>
</form>

<script>
    $(document).ready(function() {
        $('#form').parsley();

        $("#submit-form").on('click', function() {
            $('#form').parsley().validate("second");
            if ($('#form').parsley().isValid()) {
                console.log('valid');
            } else {
                console.log('not valid');
            }
        });
    });
</script>

两者之间的区别在于,在第一个示例中,您重新定义了该excluded选项.在第二个示例中,您将data-parsley-group仅使用和验证该组.

对于一个完整的示例,请访问此的jsfiddle(可对其进行测试和修改 $('#form').parsley().validate("second");,以$('#form').parsley().validate("first");看看会发生什么).