Question

我有一个带有单个date_popup字段的drupal表单。我希望仅在小时内提供12、15和17的选项。

$form['order-group']['delivery'] = array(
    '#title'                => t('I Need The Equipment Ready By'),
    '#type'                 => 'date_popup',
    '#date_format'          => 'd-M-Y H:i',
    '#timepicker'           => 'timepicker',
    '#timepicker_options'   => array(
        'rows'            => 3,
        'hours'         => array(
            'starts'    => 12,
            'ends'      => 17,
        ),
        'onHourShow'   => 'onHourShowCallback',
        'minutes'         => array(
            'starts'    => 0,
            'ends'      => 0,
        ),
        'showCloseButton' => TRUE,
        'closeButtonText' => t('Close'),
    ),
    '#default_value'  => date('Y-m-d 12:00',time()),
    '#date_label_position'  => '',
);

然后我将以下内容添加到我的javascript文件中（该脚本前面的drupal_add_js随附）

function onHourShowCallback(hour) {
    return hour == 12 || hour == 15 || hour == 17;
};

但是我遇到以下错误：

Uncaught TypeError: onHourShow.apply is not a function
    at Timepicker._generateHTMLHourCell (jquery.ui.timepicker.js?psw6eo:797)
    at Timepicker._generateHTML (jquery.ui.timepicker.js?psw6eo:622)
    at Timepicker._updateTimepicker (jquery.ui.timepicker.js?psw6eo:467)
    at Timepicker._setTimeFromField (jquery.ui.timepicker.js?psw6eo:1112)
    at Timepicker._attachTimepicker (jquery.ui.timepicker.js?psw6eo:190)
    at HTMLInputElement.<anonymous> (jquery.ui.timepicker.js?psw6eo:1474)
    at Function.each (jquery.min.js?v=1.7.2:2)
    at $.fn.init.each (jquery.min.js?v=1.7.2:2)
    at $.fn.init.$.fn.timepicker (jquery.ui.timepicker.js?psw6eo:1470)
    at Object.attach (date_popup_timepicker.timepicker.js?psw6eo:8)

我试图在Drupal堆栈交换中询问这个问题，但是被“搁置”，并告诉我这是一个编程问题，所以我在这里询问。

Answer 1

jQuery UI Timepicker使用apply()方法调用回调函数，例如'beforeShow'，'onSelect'等。：

var beforeShow = $.timepicker._get(inst, 'beforeShow');
extendRemove(inst.settings, (beforeShow ? beforeShow.apply(input, [input, inst]) : {}));

因此，回调的类型必须是函数-而不是字符串。

问题在于模块 date_popup_timepicker 在初始化时间选择器之前未将字符串回调（从服务器传入）映射到实际的js函数回调，因此，一次 jquery.ui.timepicker。 js 代码运行会抛出一个Uncaught TypeError: <callback>.apply is not a function。

在客户端，datePopup设置对象（来自Drupal.settings）可能包含字符串回调，因此，在调用timepicker（）方法之前，必须将所有这些字符串转换为相应的函数。到那里缺少什么：

var timepicker_callbacks = {
  beforeShow: null,
  onSelect: null,
  onClose: null,
  onHourShow: null,
  onMinuteShow: null
};

function timepicker_callbacks_assign (settings) {
  for (var setting in settings) {
    if (setting in timepicker_callbacks && typeof settings[setting] === 'string') {
      var namespace = window,
          ns_callback = settings[setting].split('.'),
          func = ns_callback.pop();
      for (var i = 0; i < ns_callback.length; i++) {
        namespace = namespace[ns_callback[i]];
      }
      settings[setting] = namespace[func];
    }
  }
}

timepicker（）初始化发生在Drupal.behaviors.DatePopupTimepicker中，我们只需要首先执行timepicker_callbacks_assign()即可使timepicker获得正确的设置。

我创建了issue，并在drupal.org上提交了patch，它仍然是“ Needs Review”，因此请不要犹豫从那里申请并对其进行审查。

如何使用Drupal Form API在date_popup控件中使用onHourShow回调

1 个答案: