bootstrap日期选择器插件问题

bootstrap datepicker plugin issue

本文关键字：问题 插件 选择器 日期 bootstrap      更新时间：2023-09-26

我使用了一个使用Bootstrap 2的模板。该模板具有日期选择器插件和验证字段插件。

我需要让用户从日期选择器输入日期，这样我就可以验证它。问题是它不是一次读取，我必须点击两次才能完成。因此，与验证插件的集成无法正常工作。它在我提到的第二次点击后验证。。。可能出了什么问题？

html片段：

<div class="span6">
  <div class="control-group">
    <label class="control-label">V&aacute;lido Desde<span class="required">*</span></label>
      <div class="controls">
        <div class="input-icon left">
          <i class="icon-calendar"></i>
            <input class="m-wrap m-ctrl-medium date-picker" size="16" type="text" value="{$okInfo['start_date']}" placeholder="dd/mm/yyyy" id="start_date" name="start_date" data-date="" data-date-format="dd/mm/yyyy"/>
         </div>    
       </div>
     </div>
   </div>

然后我有一个来自插件的js文件（片段）：

if (jQuery().datepicker) {
  $('.date-picker').datepicker({
    rtl : App.isRTL(),
    autoclose: true,
  });
}

最后是验证文件：

var FormValidation = function () {
var handleValidation2 = function() {
var form2 = $('#form_sample_2');
var error2 = $('.alert-error', form2);
var success2 = $('#myModal', form2);
    form2.validate({
        errorElement: 'span', //default input error message container
        errorClass: 'help-inline', // default input error message class
        focusInvalid: false, // do not focus the last invalid input
        ignore: "",
        onfocusout: function (element) {
            $(element).valid();
        },               
        rules: {
            start_date: {
                required: true,
                valid_date: true
            },
        },

我认为这个问题可能与focusout中发生的验证调用有关。

jQueryUI还将更新文本框中的聚焦日期，所以从技术上讲，该框当时是空的，没有什么可验证的？

试着在验证上添加一个超时，有点像这样吗？（未经测试！！）

onfocusout: function (element) {
    setTimeout(function(element){
        $(element).valid();
    },1000);
},

代码应该运行与以前相同的命令，但要延迟1秒。

相关文章：