如何使 bootstrap 日期选择器中的容器附加到特定元素？

Question

如何在 bootstrap 日期选择器中添加指定容器选项以使日期选择器附加到特定元素？

我添加了容器选项，但它不起作用，即添加时日期选择器没有打开。当我删除容器选项时，它默认为正文并且日期选择器显示正常。

我真的想让日期选择器仅附加到特定元素并固定在滚动上，但它根本不起作用，即日期选择器随滚动一起移动。真的很郁闷。

这是日期选择器代码，

$('#StartDate').bootstrapDP({ 
format: 'mm/dd/yyyy',
startDate: defaultDate,
container: '#StartDate",
todayBtn: 'linked',
clearBtn: true,
beforeShowDay: function(Date){

    var curr_day = Date.getDate();
    var curr_month = Date.getMonth()+1;
    var curr_year = Date.getFullYear();        
    var curr_date=curr_month+','+curr_day+','+curr_year;    

    if(!(typeof nat_arr == "undefined")){

        if (nat_arr.indexOf(curr_date)>-1) return false;
    }

},
daysOfWeekDisabled: [0,6],
todayHighlight: true
}).on('changeDate',dateChanged);

我尝试了所有方法。我调试了 Jquery UI JS，发现问题与添加容器时未附加显示块之类的东西有关，但我不确定。

请帮帮我，太好了！

Answer 1

解决方案非常简单。您所要做的就是在日期选择器选择器周围添加一个 div 并为其指定一个 ID。因此，下面的技巧：

container: div#startDate,

这意味着对于带有 id "startDate" 的日期选择器文本字段周围的 div，将其附加到元素。此外，您可能必须将 CSS 属性 "overflow:visible" 设置为容器元素，以允许 'overflowing' 容器显示日期选择器。

如何使 bootstrap 日期选择器中的容器附加到特定元素？

How to enable container in bootstrap datepicker to append to a specific element?

javascript

css

jsp

jquery-ui

bootstrap-datepicker