2016-11-17 16 views
4

Я использую Bootstrap 3 Datetimepicker, и мой ploblem - это то, что он не срабатывает, только после второго щелчка. Группа datepicker создается во время выполнения.Bootstrap 3 Datetimepicker срабатывает при втором щелчке

Вот мой код (Drupal 7):

custom.module file

$values = isset($form_state['multistep_values']['second_step']) ? $form_state['multistep_values']['second_step'] : array(); 

$form['second_step']['departure_date'] = array(
    '#theme_wrappers' => array(), // to temove drupal default wrapper 
    '#type' => 'textfield', 
    '#default_value' => isset($values['departure_date']) ? $values['departure_date'] : NULL, 
    '#attributes' => array(
     'class' => array('form-control dtpicker'), 
     'readonly' => true 
    ), 
    '#prefix' => '<div class="col-sm-8"><div class="form-group"><div class="input-group date" id="datetimepicker1">', 
    '#suffix' => '<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span></div></div></div>', 

); 

generated output

<div class="col-sm-8"><div class="form-group"><div class="input-group date" id="datetimepicker1"><input class="form-control dtpicker form-text" readonly="1" id="edit-departure-date" name="departure_date" value="" size="60" maxlength="128" type="text"><span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span></div></div></div> 

custom.js file

(function($) { 
Drupal.behaviors.custom = Drupal.behaviors.custom || {}; 

Drupal.behaviors.custom.attach = function(context) { 
    Drupal.custom.datetimepicker(context); 
}; 

Drupal.custom = Drupal.custom || {}; 

/* 
* Datetimepicker behavior 
*/ 
Drupal.custom.datetimepicker = function(context) { 
    $(document).on('click', '#datetimepicker1', function() { 
     $(this).datetimepicker({ 
      format: 'Y-MM-D HH:mm', 
      allowInputToggle: true, 
      ignoreReadonly: true, 
      showClear: true, 
      showClose: true, 
      showTodayButton: true 
     }); 
    }); 
    }; 
}(jQuery)); 

Любые идеи?

Я пытался инициализировать первый, а затем установите значения, как:

$(this).datetimepicker(); 
$(this).datetimepicker({ ... }); 

или INIT в фокусе первой и OnClick установить параметры. У них обоих все еще есть второй клик.

ответ

1

Я не знаю, о Друпала, но и может попробовать этот

<div class="form-group"> 
        <div class='input-group date' id='datetimepicker1'> 
         <input type='text' class="form-control" /> 
         <span class="input-group-addon"> 
          <span class="glyphicon glyphicon-calendar"></span> 
         </span> 
        </div> 
       </div> 

Если HTML не в таком формате не нужно связывать дополнительное событие щелчка на входе

Drupal.custom.datetimepicker = function(context) { 
$('#datetimepicker1').datetimepicker({ 
      format: 'Y-MM-D HH:mm', 
      allowInputToggle: true, 
      ignoreReadonly: true, 
      showClear: true, 
      showClose: true, 
      showTodayButton: true 
     }); 
}; 
+0

Он работает: D. Странно то, что я использовал его как это в первую очередь (до привязки события клика) и не был уволен вообще. Даже после очистки флеша Drupal. – Nemeth

+0

Спасибо Nemeth –

 Смежные вопросы

  • Нет связанных вопросов^_^