Bootstrap modal stopping checkbox от выбора

Question

У меня есть флажок в нижней части моей страницы. Когда пользователь нажимает на нее, я хочу, чтобы всплывающее окно отображалось. Все работает, кроме переключения флажка. Когда я нажимаю флажок, используя код ниже, появляется всплывающее окно, но окно не проверяется. Любая идея почему?

JQuery:

$('#confirm-final').on('show.bs.modal', function (e) { 
    $(this).find('.danger').attr('href', $(e.relatedTarget).data('href')); 
}); 

Флажок:

<label class="checkbox-inline"><asp:CheckBox ID="chkFinalSubmission" runat="server" data-toggle="modal" data-target="#confirm-final"/>Final Submission</label> 

Всплывающее:

<div class="modal fade" id="confirm-final" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
<div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      Final Submission 
     </div> 
     <div class="modal-body"> 
      If you check final submission and submit this ad note, <strong>you will not be able to change it anymore.</strong> It will be permanently stuck in readonly mode. 
     </div> 
     <div class="modal-footer"> 
      <asp:Button ID="btnConfirmFinal" runat="server" Text="Got it" class="btn btn-default" data-dismiss="modal"/> 
     </div> 
    </div> 
</div> 

Answer 1

Что касается, почему событие, обжигают, чтобы открыть содержит мода e.preventDefault(), который отменяет любое событие, которое могло произойти, щелкнув модально вызывающий элемент. Если это ссылка, href не следует, но вместо этого открывается модальный. Если это флажок, фактическая проверка отменяется. Это встроенное поведение, и вы не можете его предотвратить.

Как решить:

В Bootstrap 3 у вас есть доступ к relatedTarget имущества случае, обожженного модальный. Поскольку ваша функция уже использует relatedTarget, я предполагаю, что вы действительно используете Bootstrap 3. Вы можете просто добавить следующее правило к существующей функции JQuery:

$(e.relatedTarget).prop('checked', !$(e.relatedTarget).prop('checked')); 

(Это устанавливает флажок для обратных уже существующего «проверенных» состояния, иначе она переключает его и выключать каждый раз нажать кнопку).

Кроме того, вы уверены, что остальная часть вашего кода работает? Вы ссылаетесь на $(e.relatedTarget).data('href'), но ваш флажок не имеет data-href. Вы имели в виду data('target')?