Как проверить, открыт ли Bootstrap modal, поэтому я могу использовать jQuery validate

Мне нужно сделать проверку только в том случае, если модальный открыт, потому что если я открою его, а затем закрою его, и я нажимаю кнопку, которая открывает модальный, он не работает, потому что он делает проверку jquery, но не показывает, потому что модальный был отклонен.

поэтому я хочу объявить jquery, если модальный открыт, поэтому я проверяю, возможно ли это?

<script>
$(document).ready(function(){

var validator =$('#form1').validate(
 {
  ignore: "",
  rules: {

usu_login: {
  required: true
},
usu_password: {
  required: true
},
usu_email: {
  required: true
},
usu_nombre1: {
  required: true
},
usu_apellido1: {
  required: true
},
usu_fecha_nac: {
  required: true
},
usu_cedula: {
  required: true
},
usu_telefono1: {
  required: true
},
rol_id: {
  required: true
},
dependencia_id: {
  required: true
},
  },

  highlight: function(element) {
$(element).closest('.grupo').addClass('has-error');
        if($(".tab-content").find("div.tab-pane.active:has(div.has-error)").length == 0)
        {
            $(".tab-content").find("div.tab-pane:hidden:has(div.has-error)").each(function(index, tab)
            {
                var id = $(tab).attr("id");

                $('a[href="#' + id + '"]').tab('show');
            });
        }
  },
  unhighlight: function(element) {
$(element).closest('.grupo').removeClass('has-error');
  }
 });

}); // end document.ready

</script>
6 78
jquery twitter-bootstrap validation modal-dialog

6 ответов:

чтобы избежать состояния гонки @GregPettit упоминает, можно использовать:

($("element").data('bs.modal') || {})._isShown    // Bootstrap 4
($("element").data('bs.modal') || {}).isShown     // Bootstrap <= 3

как говорится в Twitter Bootstrap Modal-IsShown.

когда модальный еще не открыт,.data('bs.modal') возвращает undefined, отсюда || {} - который сделает isShown значение (falsy)undefined. Если вы в строгости можно было бы сделать ($("element").data('bs.modal') || {isShown: false}).isShown

137

можно использовать

$('#myModal').hasClass('in');

Bootstrap добавляет in класс, когда модальный открыт и удаляет его при закрытии

59

вы также можете напрямую использовать jQuery.

$('#myModal').is(':visible');
31
$("element").data('bs.modal').isShown

не будет работать, если модальный не был показан раньше. Вам нужно будет добавить дополнительное условие:

$("element").data('bs.modal')

Так что ответ с учетом первого появления:

if ($("element").data('bs.modal') && $("element").data('bs.modal').isShown){
... 
}
4

on bootstrap-modal.в JS-версии v2.2.0:

( $('element').data('modal') || {}).isShown
0

Проверьте, открыт ли модальный

$('.modal:visible').length && $('body').hasClass('modal-open')

прикрепить прослушиватель событий

$(document).on('show.bs.modal', '.modal', function () {
    // run your validation... ( or shown.bs.modal )
});
0