如何验证jQuery UI日期选择器“从日期”到“到日期”

sumanta.k

我有2个字段“起始日期”和“截止日期”。我是jQuery的新手,正在学习中。

  1. 在jQuery UI Date Picker上从日期中进行选择时,所有以前的日期(当前日期之前)将是不可选择的(显示为灰色)。
  2. 选择日期时,仅从当前日期开始的日期
    • 可以选择1天(无法从日期或经过的日期中选择相同的日期)

我目前正在使用此代码:

$( function() {
var dateFormat = "dd-mm-yy",
  from = $( "#from" )
    .datepicker({
      defaultDate: "+1w",
      changeMonth: true,
      numberOfMonths: 3
    })
    .on( "change", function() {
      to.datepicker( "option", "minDate", getDate( this ) );
    }),
  to = $( "#to" ).datepicker({
    defaultDate: "+1w",
    changeMonth: true,
    numberOfMonths: 3
  })
  .on( "change", function() {
    from.datepicker( "option", "maxDate", getDate( this ) );
  });

function getDate( element ) {
  var date;
  try {
    date = $.datepicker.parseDate( dateFormat, element.value );
  } catch( error ) {
    date = null;
  }

  return date;
}
});

注意:日期格式应为“ dd-mm-yy

鞭子

要使当前日期之前的日期变灰,只需在datepicker配置中将minDate设置为当前日期即可。

minDate: new Date()

您还应该显式地将dateFormat选项设置为与$ .datepicker.parseDate调用中使用的选项相同。

如果我正确理解了您的问题,那么这种提琴应该是正确的(稍微修改了您的代码)

http://jsfiddle.net/8w8v9/1846/

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

将jquery UI日期选择器绑定到输入元素的焦点上

来自分类Dev

如何选择一个日期选择器的minDate到用户选择的日期

来自分类Dev

jQuery Ui日期时间选择器

来自分类Dev

jQuery UI日期时间选择器

来自分类Dev

jQuery ui 日期选择器

来自分类Dev

无法使用jQuery UI的日期选择器比较日期

来自分类Dev

jQuery UI日期选择器日期格式

来自分类Dev

jQuery-UI 的日期选择器的默认日期范围

来自分类Dev

jQuery-日期选择器日期

来自分类Dev

如何使用引导日期时间选择器从视图发布时间到控制器

来自分类Dev

如何分配日期,在Windows Phone 8.1 C#中从上一页或窗体导航到日期选择器

来自分类Dev

如何将日期选择器中的值存储到字符串变量中

来自分类Dev

现在禁用了先前选择的日期时的Angular-UI日期选择器验证错误

来自分类Dev

jQuery UI-无法使日期选择器正常工作

来自分类Dev

jQuery Ui日期选择器不起作用?

来自分类Dev

jQuery Mobile UI日期选择器格式

来自分类Dev

jQuery UI-无法使日期选择器正常工作

来自分类Dev

jQuery UI:日期选择器显示不正确

来自分类Dev

在jQuery Mobile UI中添加日期选择器

来自分类Dev

jQuery UI日期选择器显示不正确

来自分类Dev

如何在jQuery UI日期选择器中动态设置最小和最大日期

来自分类Dev

如何更改Material UI的日期选择器的填充?

来自分类Dev

在JQuery UI日期选择器中选择星期数或日期

来自分类Dev

Jquery日期选择器,选择年份

来自分类Dev

jquery 日期选择器选择的日期格式

来自分类Dev

日期时间选择器验证

来自分类Dev

Angular-ui-bootstrap-日期选择器-如何限制对弹出窗口中日期选择器的访问?

来自分类Dev

无法使用jQuery UI的日期选择器设置默认日期

来自分类Dev

未来的日期引发错误的jQuery UI的日期选择器

Related 相关文章

  1. 1

    将jquery UI日期选择器绑定到输入元素的焦点上

  2. 2

    如何选择一个日期选择器的minDate到用户选择的日期

  3. 3

    jQuery Ui日期时间选择器

  4. 4

    jQuery UI日期时间选择器

  5. 5

    jQuery ui 日期选择器

  6. 6

    无法使用jQuery UI的日期选择器比较日期

  7. 7

    jQuery UI日期选择器日期格式

  8. 8

    jQuery-UI 的日期选择器的默认日期范围

  9. 9

    jQuery-日期选择器日期

  10. 10

    如何使用引导日期时间选择器从视图发布时间到控制器

  11. 11

    如何分配日期,在Windows Phone 8.1 C#中从上一页或窗体导航到日期选择器

  12. 12

    如何将日期选择器中的值存储到字符串变量中

  13. 13

    现在禁用了先前选择的日期时的Angular-UI日期选择器验证错误

  14. 14

    jQuery UI-无法使日期选择器正常工作

  15. 15

    jQuery Ui日期选择器不起作用?

  16. 16

    jQuery Mobile UI日期选择器格式

  17. 17

    jQuery UI-无法使日期选择器正常工作

  18. 18

    jQuery UI:日期选择器显示不正确

  19. 19

    在jQuery Mobile UI中添加日期选择器

  20. 20

    jQuery UI日期选择器显示不正确

  21. 21

    如何在jQuery UI日期选择器中动态设置最小和最大日期

  22. 22

    如何更改Material UI的日期选择器的填充?

  23. 23

    在JQuery UI日期选择器中选择星期数或日期

  24. 24

    Jquery日期选择器,选择年份

  25. 25

    jquery 日期选择器选择的日期格式

  26. 26

    日期时间选择器验证

  27. 27

    Angular-ui-bootstrap-日期选择器-如何限制对弹出窗口中日期选择器的访问?

  28. 28

    无法使用jQuery UI的日期选择器设置默认日期

  29. 29

    未来的日期引发错误的jQuery UI的日期选择器

热门标签

归档