# Bootstrap Datepicker 在 Modal 時，位置跟著視窗改變 ( 跑版 )
###### tags: `被玩壞了`

## 壞掉的情況 ( 跟著 Window 位置跑 )

## 正常的情況 ( 在 input 附近 )

## 解決方案

### 1. 如果父層級的元素不是相對放置，Datepicker將顯示在錯誤的位置。
在父層級的元素加上 style="position:relative"

<div class="input-group date" id="publicExamQuestionYears" style="position:relative">
    <input class="form-control" id="PublicYears" name="PublicYears" readonly="readonly" type="text" value="">
    <div class="input-group-append">
    <button class="btn btn-outline-dark btn-3D" type="button">選</button>
    </div>
</div>

### 2. 在初始化 datepicker 的時候給他指定容器 ( 不知道為什麼指定 Modal(非父元素) 也可以 )

$('#myDatePicker').datepicker({
  container:'#myModalId'
});

[參考](https://stackoverflow.com/questions/27966645/bootstrap-datepicker-appearing-at-incorrect-location-in-a-modal)