bootstrap datetimepicker不能在bootstrap模式下工作

我需要在bootstrap模式下使用bootstrap datetimepicker。我已經成功地在一個普通的網頁中使用它。引導壓光機不會在模式中打開。這是我動態生成的html代碼。bootstrap datetimepicker不能在bootstrap模式下工作

'<div class="col-xs-12">'+ 
    '<div class="col-xs-4">'+ 
    '<div class="form-group">'+ 
'<label for="editStartTime">Start Time </label>'+ 
     '<div class="input-group date" id="editStartTime">'+ 
      '<input type="text" class="form-control" value="'+startTime+'"/>'+ 
    '<span class="input-group-addon">'+ 
    '<span class="glyphicon glyphicon-calendar"></span>'+ 
    '</span>'+ 
'</div>'+ 
'</div>'+ 
'</div>'

這是jquery的一部分。

$(function() { 
       $('#editStartTime').datetimepicker(); 
      });

會有什麼問題？

來源

2015-07-20 Shashika

您需要再次實例化的日期選擇器的動態HTML被添加到DOM後。你可以在引導模式顯示的事件中調用它：

$('.modal').on('shown.bs.modal', function() { 
    $('#editStartTime').datetimepicker(); 
}

來源

2015-07-20 15:57:51 ijsnow

類添加日期選擇器上方1051的z-index

添加這樣的事情在頁面或CSS

<style> 
.datepicker{z-index:1151 !important;} 
</style>

來源

2015-07-20 15:26:56 kbonnelly

它沒有工作。你認爲這是一個CSS問題 – Shashika

嘗試.datepicker而不是.datetimepicker – kbonnelly

它也沒有工作 – Shashika

'開始時間' 中沒有找到的爲您的ID樣本。

也許你需要使用「#editStartTme」

來源

2015-07-20 15:55:36

這是一個打字錯誤。我使用了正確的ID。 – Shashika

我不認爲你的目標是正確的元素。您指定$("#StartTime")...，它將在您的HTML中查找ID（＃）爲id="StartTime"的元素。在您提供的HTML注意，不存在：

<input type="text" class="form-control" value="'+startTime+'"/>'+

要麼添加ID id="startTime"或class="form-control startTime類，並在您的jQuery的正確定位是：

$(function() { 
    $('#startTime').datetimepicker(); // # for ID 
    // or 
    $('.startTime').datetimepicker(); // . for class 
});

來源

2015-07-20 15:57:57

-1

保持腳本結束之前這個js。這對我有用。

// Since confModal is essentially a nested modal it's enforceFocus method 
// must be no-op'd or the following error results 
// "Uncaught RangeError: Maximum call stack size exceeded" 
// But then when the nested modal is hidden we reset modal.enforceFocus 
var enforceModalFocusFn = $.fn.modal.Constructor.prototype.enforceFocus; 

$.fn.modal.Constructor.prototype.enforceFocus = function() {}; 

$confModal.on('hidden', function() { 
    $.fn.modal.Constructor.prototype.enforceFocus = enforceModalFocusFn; 
});

來源

2016-10-28 05:01:25

bootstrap datetimepicker不能在bootstrap模式下工作

回答

相關問題