Parsleyjs 日期验证不适用于 Onchange 等 Datepicker 事件

Posted 2023-05-09

【中文标题】Parsleyjs 日期验证不适用于 Onchange 等 Datepicker 事件

【英文标题】：Parsleyjs Date Validation Doesn't work on Datepicker Events like Onchange

【发布时间】：2016-01-23 17:16:33

【问题描述】：

我有一个带有日期选择器输入字段的表单，即使在选择日期之后也会要求输入值。

注意：当我输入值时不会出现此错误。

<input data-parsley-trigger="change" name="epa_date" required type="text" class="form-control" id="single_cal1" placeholder="(YYYY/MM/DD)">
<script>
$('#single_cal1').daterangepicker(
            singleDatePicker: true,
              minDate: moment(),
             format: 'YYYY/MM/DD',
            maxDate:  moment().add(15, 'days'),
            calender_style: "picker_1"
        , function (start, end, label) 
            console.log(start.toISOString(), end.toISOString(), label);
        );
</script>

编辑说明：我已经更新了我使用的日期选择器的脚本。 我正在使用 Parsleyjs 进行所有验证。

【问题讨论】：

验证是否存在？

请显示更多代码

@CodeLove 是的，即使在填写了所需的输入之后，验证仍然存在。

要明确，您的问题是在输入中键入值时未触发验证？这可能与 datepicker 组件有关。你能提供一个复制你的问题的小提琴和你的问题的详细描述吗？

【参考方案1】：

我在使用 bootstrap-datepicker 时遇到了问题，这为我解决了这个问题：https://bootstrap-datepicker.readthedocs.io/en/latest/events.html

$('#datefield').datepicker()
    .on('changeDate', function(e) 
        $(this).parsley().validate();
);

【参考方案2】：

我正在使用DatePicker 和Parsley 2.0，这对我有用（感谢@siva anand）..

$(function() 
    $("#yourdatefield").datepicker( 
        dateFormat: 'yy-mm-dd', 
        onClose: function () 
        $(this).parsley().validate();
        
    );

然后在欧芹田里..

'data-parsley-trigger'          => 'change focusout',

【参考方案3】：

试试这个，我在 daterangepicker 中再次触发了欧芹。它对我有用。

   <input data-parsley-trigger="change" name="epa_date" required type="text" class="form-control" id="single_cal1" placeholder="(YYYY/MM/DD)">
    <script>
    $('#single_cal1').daterangepicker(
                singleDatePicker: true,
                  minDate: moment(),
                 format: 'YYYY/MM/DD',
                maxDate:  moment().add(15, 'days'),
                calender_style: "picker_1"
            , function (start, end, label) 
                $('#single_cal1').parsley().validate();
                console.log(start.toISOString(), end.toISOString(), label);
            );
    </script>

希望对你有帮助..

【参考方案4】：

当你初始化 parsley 时，给 triggerAfterFailure 添加更改，这样当你选择一个日期或更改日期时，parsley 会重新验证。 triggerAfterFailure 的默认值是 input。

$('form.parsley').parsley(
        triggerAfterFailure: 'input change'
);

【参考方案5】：

根据this bug report，看起来验证必须在更改时手动触发。以下对我有用：

var d = $('#single_cal1');
d.daterangepicker(
  onClose: function() 
    d.validate();
  
);