bootstrap-datepicker double addon과 stopPropagation

Question

나는 bootstrap-datepicker를 사용하고 체크 박스가있는 두 번째 애드온을 갖고 싶습니다. 체크 박스 애드온을 클릭하면 데이트 피커 쇼를 트리거하고 싶지 않습니다. 나는 두 번째 부가 기능의 onclick 이벤트에 false를 반환의 인 stopPropagation을 테스트했지만 작동하지 않습니다 :(

<div class="container"> 
<div class ="form-group"> 
<label class="col-sm-2 control-label" >Received Date</label>   
<div class="col-sm-2 input-group date" data-date-format="mm-dd-yyyy" id="ARDT"> 
    <input class="text-input form-control" type="text" name="ARDT" maxlength="10" /> 
    <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>           
    <span class="input-group-addon test"><input type="checkbox"/></span> 
</div> 
</div> 
</div> 

을이 자바 스크립트로 :이 jsfiddle에서 라이브 볼 수 있습니다

$(document).ready(function() { 
    $('#ARDT').datepicker();  
$('.date .test').click(function(e){ 
    e.stopPropagation(); 
    }); 
}); 

: http://jsfiddle.net/5a5xzz10/4/

당신이 날 도와 드릴까요?

감사 Whiletrue

,

EDIT : 실측치 용액 :

<div class ="form-group"> 
<label class="control-label" >Received Date OK</label>  
<div class="input-group"> 
    <div class="input-group date" data-date-format="mm-dd-yyyy" id="ARDT2"> 
    <input class="text-input form-control" type="text" name="ARDT" maxlength="10" /> 
    <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>           
    </div> 
    <span class="input-group-addon"><input type="checkbox"/></span> 
</div> 
</div> 

다른 내부 날짜 선택기의 입력 그룹을 embbed 단지 여기 추천

후 2 입력 기 부가 입력 : http://jsfiddle.net/5a5xzz10/6

Answer 1

I 대답은 있지만 매우 우아하지는 않습니다.

datepicker 생성을 시작한 후에 체크 박스를 추가했습니다.

$(document).ready(function() { 
    $('#ARDT').datepicker(); 
    $("div.date").append($('<span class="input-group-addon test"><input type="checkbox"/></span>')); 
});