[bootstrap] 구글 크롬에서 bootstrap datapicker가 작동하지 않을때

Internet Explorer에서는 작동을 잘하지요.

근데 갑자기 구글 크롬을 켜보니 안되는 문제를 발견했네요.

datepicker.js를 변경해주면 쉽게 해결이 됩니다.

zIndex로 검색하면 딱 550 줄 정도에 나와요.

   var zIndex = parseInt(this.element.parents().filter(function(){
     return $(this).css('z-index') !== 'auto';
    }).first().css('z-index'))+1151;

10으로 되있는데 이걸 1151로 변경해주면 됩니다.

그럼 잘돌아가유~

 이렇게 잘 나오네요 ㅋㅋ

참고로 데이터 datepicker를 사용하실려면 3개의 파일이 필요해요.

 1. datepicker core js

bootstrap-datepicker.js

 2.한글 지원을 위한 js

bootstrap-datepicker.kr.js

 3.그리고 먹일 css

datepicker3.css

 

EX) Example

1.Import

</div> <link rel="stylesheet" type="text/css" href="<c:url value='/css/bootstrap/datepicker3.css' /> " />

<script src="<c:url value='/js/lib/bootstrap/bootstrap-datepicker.js' /> "></script>

<script src="<c:url value='/js/lib/bootstrap/bootstrap-datepicker.kr.js' /> "></script>

2. config

 $('#datapickerBox input').datepicker({
  format: "yyyy-mm-dd",
  startView: 1,
  todayBtn:"linked",
  language: "kr",
  orientation: "top auto",
  keyboardNavigation: false,
  forceParse: false,
  autoclose: true,
  todayHighlight: true
 });

3.tag

<div class="col-xs-1" id="datapickerBox">
<input class="form-control input-sm" type="text" id="wrtDtReg" name="wrtDt" placeholder="" readonly="readonly">

 

잘쓰세여 ~