Не работает datepicker (Bootstrap)?

Question

[Alexey]

Необходимо отобразить в поле input - календарь (datepicker (Bootstrap)).
Проблема в том что в первом случае он отображается:

<input type="text" class="datepicker_goal" data-provide="datepicker" value="Period">

$('.modal-body input[data-provide="datepicker"]').datepicker();

Но у меня есть модальное окно, при активации создается другая форма и добавляется тег:

<input type="text" class="datepicker_goal_modal" data-provide="datepicker_modal" value="Period">

$('.modal-body input[data-provide="datepicker_modal"]').datepicker();

Но во втором варианте, datepicker не активируется и календарь не видно. Да ещё и конфликтует что-то, закрывается модальное окно.
Подскажите, что я сделал не так и как это устранить? Как отобразить календарь во всех полях модальной формы?

Answer 1

[Артем]

Попробуй так

<input type="text" class="datepicker_goal" data-provide="datepicker" value="Period">

$('.modal-body input').datepicker();

Comments

[Alexey]

К сожалению не получается.
После того как я создаю input:

при первом клике ничего не происходит, при втором, у меня очищается модальное окно. Как узнать что влияет на этот процесс?

Answer 2

[Дмитрий Евграфович]

Повесь инициализацию дейтпикера на событие появления модального окна.

$('#myModal').on('show.bs.modal', function (e) {
  if (!data) return e.preventDefault() // stops modal from being shown
})

События скриптов бутстрапа можешь тут поискать getbootstrap.com/javascript/, show.bs.modal не помню перед или после появления окна срабатывает