Pertanyaan Cara memeriksa apakah modal bootstrap terbuka, jadi saya bisa menggunakan validasi jquery


saya perlu membuat validasi hanya jika modal terbuka, karena jika saya membukanya, dan kemudian saya menutupnya, dan saya menekan tombol yang membuka modal itu tidak berfungsi karena membuat validasi jquery, tetapi tidak menunjukkan karena modal itu diberhentikan.

Jadi saya ingin membuat jquery jika modal terbuka sehingga saya melakukan validasi, apakah ini mungkin?

<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>

75
2017-10-21 23:42


asal


Jawaban:


Untuk menghindari kondisi balapan @GregPettit sebutkan, seseorang dapat menggunakan:

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

seperti yang dibahas dalam Twitter Bootstrap Modal - IsShown.

Ketika modal belum dibuka, .data('bs.modal') kembali undefined, maka itu || {} - yang akan membuat isShown nilai (falsy) undefined. Jika Anda sangat ketat yang bisa dilakukan ($("element").data('bs.modal') || {isShown: false}).isShown


135
2018-01-24 20:09



Kamu dapat memakai

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

Bootstrap menambahkan in kelas ketika modal terbuka dan menghapusnya ketika ditutup


59
2017-10-22 00:01



Anda juga dapat langsung menggunakan jQuery.

$('#myModal').is(':visible');

30
2017-10-08 14:09



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

tidak akan berfungsi jika modal belum pernah ditampilkan sebelumnya. Anda perlu menambahkan ketentuan tambahan:

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

jadi jawabannya dengan mempertimbangkan penampilan pertama:

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

4
2018-04-21 10:27



Pada bootstrap-modal.js v2.2.0:

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

0
2018-06-12 18:19



Periksa apakah modal terbuka

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

Untuk melampirkan pendengar acara

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

0
2018-04-23 08:15