如何验证 Bootstrap 表单助手 DatePicker 是否需要或不为空？答案

【问题标题】：How to validate Bootstrap Form Helpers DatePicker as Required or Not Empty?如何验证 Bootstrap 表单助手 DatePicker 是否需要或不为空？
【发布时间】：2015-04-07 00:11:37
【问题描述】：

我尝试使用 data-bv-notempty 属性但没有成功。下面的代码示例：

<form class="form-horizontal" id="form-registration" action="/submit.php" method="post" >
  <div class='form-group'>
  <div class='field-group'>
    <label for='user_name' class='col-sm-5 control-label' id='label__user_name'>Name<sup>*</sup>:</label>
    <div class='col-sm-7 control-data'><input type='text' name='user_name' required data-bv-notempty  class='form-control' ></div>
  </div>
  </div>

  <div class='form-group'>
  <div class='field-group'>
    <label for='date_entry' class='col-sm-5 control-label' id='label__date_entry'>Date<sup>*</sup>:</label>
    <div class='col-sm-7 control-data'>
    <div class='bfh-datepicker' data-name='date_entry' data-date='' data-bv-notempty data-max='today'></div>
    </div>
  </div>
  </div>

  <div class='text-center'><button type='button' id='btn-submit' class='btn btn-sm btn-default'>Continue</button></div>
  </form>

第一个字段 user_name 通过属性 data-bv-notempty 成功验证，但不是 date_entry 字段。有什么建议吗？

更新

发现了一些奇怪的东西。我将data-bv-field='date_entry' 属性添加到bfh-datepicker div。现在，如果首先选择一个日期并执行验证，它就会通过验证。另一方面，如果先执行验证，验证失败，并在验证失败后输入日期，则红十字会保留，验证仍然不通过。奇怪。

【问题讨论】：

我自己没有使用过，但我希望您可能需要将required 属性添加到您的div.bfh-datepicker。
必需的 data-bv-notempty 为什么你不把它也设为必需？
忘了说required属性之前试过了，没有效果。请注意，属性被添加到 <div> 而不是 <input> 元素，因为输入是由 bootstrap-form-helpers 代码动态生成的。

标签： jquery twitter-bootstrap validation bootstrap-form-helper

【解决方案1】：

看起来没有任何方法可以在 input 上指定您自己的自定义属性，但您应该能够在 Bootstrap Form Helper 构造 input 后使用 Javascript 添加 required 属性。

<div class="bfh-datepicker" id="the-required-datepicker"></div>

<script src="jquery.min.js"></script>
<script src="bootstrap-formhelpers.js"></script>
<script>
  $(function() {
    $('#the-required-datepicker input').attr('required','required');
  });
</script>

【讨论】：

如何通过javascript设置国家