Boostrap datetimepicker 不是预填充日期

编程问答 2022-04-28

问题描述

我正在使用 Boostrap 日期时间选择器在 fullcalendar 中进行预订。 我想在单击日历时使用选定的日期和时间预先填充我的日期时间选择器。

使用以下代码，我可以预填充时间但不能预填充日期，我不知道为什么。我发现我应该只更改我想要显示的格式，但是这样做之后，日期没有被预填充。

select: function(inform) {
                var date_from= new Date(inform.startStr);
                var date_to= new Date(inform.endStr) ;
                let currentDate = new Date();
                
                if (date_from >= currentDate) {
                    $('#exampleModalToggle').modal('show');
                    console.log(' date clicked bigger than current date,you can do reservation')
                    $(".fc-highlight").css("background","#ffc800","important!"); 
                    
                    
                    $(function() {
                        $("#start_date_picker").datetimepicker({
                            format: 'yyyy-MM-dd',locale: "fr",useCurrent:false,defaultDate: date_from,});
                        
                        $("#start_hour_picker").datetimepicker({
                            format: 'HH:mm',});
                        
                        $("#end_date_picker").datetimepicker({
                            format: 'yyyy-MM-dd',defaultDate: date_to,});
                        
                        $("#end_hour_picker").datetimepicker({
                            format: 'HH:mm',})
                    });

                } 
            },
<!--Start Date-->
 <div id="start_date"  class="add_reservation_subtitles pb-3" style="margin-left: 28px;">
                                <input id="start_date_input" data-provide="datepicker" name="start_date" type="date"
                                    lang="fr" id="datepicker_second" class="datepicker1" style="margin-left: 28px;" required>
                                <input name="start_hour" type="time" lang="fr" class="timepicker modal_rigth_elements"
                                    required>
                            </div>
                     
 <!--End Date-->
  <div id="end_date" style="margin-left: 28px;" class="add_reservation_subtitles pb-3 ">
                                <input id="end_date_input" type="date" lang="fr" class="date-picker"
                                    style="margin-left: 28px;" required>
                                <input name="end_hour" type="time" lang="fr" class="timepicker modal_rigth_elements"
                                    required>
                            </div>

我尝试了不同的格式，例如 yyyy-mm-dd、'mm-dd-yyyy'、'mm/dd/yyyy'，但没有任何效果。我什至没有错误消息。所以我不知道发生了什么。

我正在使用这个日期时间选择器：

<link rel="stylesheet"href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.min.css" />

非常感谢您的帮助

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

bootstrap-datetimepickerfullcalendarjavascripttwitter-bootstrap