不工作日期选取器(引导）

Does not work datepicker (Bootstrap)?

本文关键字：引导 选取 工作 工作日 日期      更新时间：2023-09-26
显示在

输入 - 日历（日期选择器（引导程序））中。问题是，在前一种情况下，它似乎： 

<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();

但在第二实施例中，日期选择器未被激活且日历不可见。甚至冲突的东西也会关闭模态窗口。告诉我我做错了什么以及如何解决它？如何在所有字段模态表单中显示日历？

这是工作 Jsfiddle 供参考。它具有附加到输入字段的模式弹出窗口和日期选择器。

$('input[data-provide="datepicker"]').datepicker();    
// Append New Input field
$("div.modal-body").append(" <input type='"text'" class='"datepicker_goal_modal'" data-provide='"datepicker_modal'" placeholder='"Period'">")
// After appending, call datepicker on input field.
$('.modal-body input[data-provide="datepicker_modal"]').datepicker();

$('body').on('focus', '.datepicker_goal_modal', function(){
    $(this).datepicker();
});​

这应该有效。它之前不会出现的原因是因为您正在动态创建模态，并且元素选择器函数仅适用于页面首次加载时存在的元素。

相关文章：