Как создать приглашение загрузочного окна с помощью средства выбора даты начальной загрузки в качестве входных данных
-
21-12-2019 - |
Вопрос
Я создаю диалоговое окно с помощью bootbox.
bootbox.dialog({
message: 'Datepicker input: <input id="date"></input>',
title: "Custom label",
buttons: {
main: {
label: "Save",
className: "btn-primary",
callback: function () {
console.log("Hi " + $('#first_name').val());
}
}
}
});
$("#date").datepicker(); //Not working
Есть идеи о том, как создать приглашение загрузочного окна с вводом даты?Спасибо
Решение
Этот обходной путь сделал это для меня.Любая лучшая асоч для этого вопроса приветствуется.
function BootboxContent() {
var frm_str = '<form id="some-form">'
+ '<div class="form-group">'
+ '<label for="date">Date</label>'
+ '<input id="date" class="date span2 form-control input-sm" size="16" placeholder="dd-mm-yy" type="text">'
+ '</div>'
+ '</form>';
var object = $('<div/>').html(frm_str).contents();
object.find('.date').datepicker({
format: 'yyyy-mm-dd',
autoclose: true
}).on('changeDate', function (ev) {
$(this).blur();
$(this).datepicker('hide');
});
return object
}
//Show the datepicker in the bootbox
bootbox.dialog({
message: BootboxContent,
title: "Reschedule Rule",
buttons: {
main: {
label: "OK",
className: "btn-primary"
}
}
});
.
Дата Дата будет отображаться за модальным наложением.В DatePicker.css добавьте z-index: 99999! Важный на .datepicker
Чтобы передать каландорировать прямо под наличием DatePicker в зависимости от положения диалогового окна BOOTBOCK, добавьте следующее стиль:
.modal-open .datepicker {
left: 52% !important; //Change it according to the position of your dialog
top: 25% !important; //Change it according to the position of your dialog
}
. Другие советы
У меня был тот же вопрос по поводу проекта Ember, над которым я работал.Применение моего решения к вашему коду будет выглядеть так:
bootbox.dialog({
message: 'Datepicker input: <input id="date"></input>',
title: 'Custom label',
buttons: {
main: {
label: 'Save',
className: 'btn-primary',
callback() {
console.log("Hi " + $('#first_name').val());
}
}
}
}).datepicker();
Просто добавьте datepicker()
до конца вашего вызова Bootbox.Работал у меня над моим проектом, надеюсь, что это сработает и у вас в вашем.