jQuery Datetimepicker - 点击更改minDateTime和maxDateTime？ [英] jQuery Datetimepicker - change minDateTime and maxDateTime on click?

问题描述

我正在使用优秀的Trent Richardson datetimepicker插件来使用jQuery UI datepicker。

我有一行数据，每行有两个选择器实例，一个用于开始，一个用于进程的结束时间。当我的用户点击一个时，我想根据另一个框的值重置最小或最大datetime元素 - 换句话说，根据开始时间和开始时间（基于结束时间）限制结束时间（以防止用户在开始之后结束或结束之前启动）。

我调用datetimepicker这样：

  $（'。c_inbox_date'）。datetimepicker（{
 hourGrid：12，
 minuteGrid：30，
 timeFormat：'HHmm'，
 showTimezone：false，
}）
  

这是我正在努力重置的功能最小和最大飞行时间：

  $（'。c_inbox_date'）。click（function（）{
 var this_col = $（this）.closest（'td'）。parent（）。children（）。index（$（this）.closest（'td'））; 
 if（this_col == 3） {
 var stop_time = $（this）.closest（'td'）。next（'td'）。children（'input'）。val（）; 
 $（this）.datetimepicker（{ 
 maxDateTime：stop_time 
}）
} else {
 var start_time = $（this）.closest（'td'）。prev（'td'）。children（'input'）。val （）; 
 $（this）.datetimepicker（{
 minDateTime：new Date（start_time）
}）
} 
}）
  

功能中的警报框确认start_time和stop_time变量包含正确的值。正如你所看到的，我尝试使用'新日期'来确保该值实际上是一个日期对象，但是这也不起作用。

任何人都可以告诉我为什么这不行？ datetimepicker是否允许这种即时更改？还是我的语法搞砸了？任何帮助，一如既往，非常感谢。

解决方案

使用这两个。

  $（'input'）
 .datepicker（'option'，'maxDate'，new Date（））
 .datetimepicker（'option' ，'maxDateTime'，new Date（））; 
  

逆向工程的乐趣...

I'm using the excellent Trent Richardson datetimepicker addon to the jQuery UI datepicker.

I have rows of data with two instances of the picker on each row, one for the start and one for the end time of a process. When my user clicks one, I'd like to reset the min or max datetime element based on the value of the other box - in other words, limit the end time based on the start time and the start time based on the end time (to prevent the user from starting after end or ending before start).

I invoke the datetimepicker like this:

$('.c_inbox_date').datetimepicker({
    hourGrid: 12,
    minuteGrid: 30,
    timeFormat: 'HHmm',
    showTimezone: false,
})

Here's the function I'm working on to reset the min and max times on the fly:

$('.c_inbox_date').click(function() {
    var this_col = $(this).closest('td').parent().children().index($(this).closest('td'));  
    if (this_col == 3) {
        var stop_time = $(this).closest('td').next('td').children('input').val();       
        $(this).datetimepicker({
            maxDateTime: stop_time
        })              
    } else {    
        var start_time = $(this).closest('td').prev('td').children('input').val();
        $(this).datetimepicker({
            minDateTime: new Date(start_time)
        })              
    }
})

Alert boxes in the function confirm that the start_time and stop_time variables contain the correct values. As you can see, I tried using 'new Date' to make sure the value was actually a date object, but that didn't work either.

Can anyone tell me why this doesn't work? Does datetimepicker allow this kind of on-the-fly change? Or is my syntax messed up? Any help is, as always, much appreciated.

解决方案

Use both of them.

$('input')
  .datepicker('option', 'maxDate', new Date())
  .datetimepicker('option', 'maxDateTime', new Date());

The joys of reverse engineering...

这篇关于jQuery Datetimepicker - 点击更改minDateTime和maxDateTime？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！