Bootstrap Datepicker показывает позади popover

Question

Я пытаюсь отобразить дампикер в popover (используя bootstrap и расширение bootstrap-datepicker) и с некоторыми проблемами, сначала у меня возникла проблема с отображением datepicker и нашла эту тему: Datepicker in Popover Won't display , но теперь он показывает за моей пирог, так что это не полностью видно

Вот HTML-код:

<button type="submit" class="btn btn-primary pop_doleance" rel="popover" data-original-title="Ajouter doléance">Ajouter doléance</button> 

<div style="display: none" class="pop_doleance_content"> 
<form class="well form-inline form_doleance"> 
    <label for="date">Date : </label> 
    <input id="date" type="text" class="input-medium"> 
</form> 

И код Javascript :

var tmp = $.fn.popover.Constructor.prototype.show; 
$.fn.popover.Constructor.prototype.show = function(){ 
    tmp.call(this); 
    if (this.options.callback) { 
    this.options.callback(); 
    } 
} 

$(function(){ 
    $(".pop_doleance").popover({ 
     placement:'bottom', 
     html : true, 
     content: function(){return $('.pop_doleance_content').html();}, 
     callback: function(){$('#date').datepicker();} 
    }); 
}); 

Любые идеи?

Answer 1

установить z-index для всплывающего окна для более низкого значения.

.popup { z-index : 900; } 

и установить контейнер Z-индекс Datepicker на более высокое значение, как и в случае с JQuery UI DatePicker набор

.ui-datepicker-div { z-index: 999; }