基金会5遵守js检查日期是否在另一个日期之前

时间:2014-01-09 08:23:18

标签: javascript forms zurb-foundation

我正在使用zurb foundation 5abide js来检查我的表单。我必须检查DATE1是否在DATE2

之前或等于abidejs

如何检查{{1}}是否有效?

1 个答案:

答案 0 :(得分:2)

简短的回答是你不能真正遵守这一点。 Abide不利于您需要与日期进行比较,以检查日期是否大于或等于另一个。一些自定义的javascript可以为你做到这一点,但你会发现坚持会打击你控制错误信息,这意味着你将完全废弃并完成所有的错误处理。

以下是我的意思:

HTML

<div class="panel">
  <form data-abide class="date-form">
    <div class="date-1">
      <label>Date 1</label>
      <input type="date">
      <small class="error">This is not a valid date.</small>
    </div>
    <div class="date-2">
      <label>Date 2</label>
      <input type="date">
      <small class="error">Date 2 must be a valid date and fall on or after date 1.</small>
    </div>
    <button type="submit">Submit</button>
  </form>
</div>

的Javascript

//lets do a check when one of the input values has changed
$('.date-form').on('change', '.date-1 input, .date-2 input', function() {
  //lets convert our dates to values we can do a comparison with
  date1 = Date.parse($('.date-1 input').val());
  date2 = Date.parse($('.date-2 input').val());

  //lets check that both values are valid numbers
  if ($.isNumeric(date1) && $.isNumeric(date2)) {
    //lets check if date 2 is not greater or equal to date one and throw an error
    if (date1 > date2) {
      //we have a problem add error class to date-2 for error message
      $('.date-2').addClass('error');
    }
  }
});

这将与坚持斗争。这是一个小提琴来说明它http://codepen.io/anon/pen/fiKFc

如此长的回答仍然是你无法真正用到这一点。遗憾。