I need to make a validation only if a modal is open, because if I open it, and then I close it, and the I press the button that opens the modal it doesn't work because it is making the jquery validation, but not showing because the modal was dismissed.
So I want to ad a jquery if modal is open so the i do validate, is this possible?
<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>
This question is related to
jquery
validation
twitter-bootstrap
modal-dialog
Why complicate things when it can be done with simple jQuery like following.
$('#myModal').on('shown.bs.modal', function (e) {
console.log('myModal is shown');
// Your actual function here
})
Bootstrap 2 , 3 Check is any modal open in page :
if($('.modal.in').length)
compatible version Bootstrap 2 , 3 , 4+
if($('.modal.in, .modal.show').length)
Only Bootstrap 4+
if($('.modal.show').length)
You can also use
$('#myModal').hasClass('show');
As a workaround I personally use a custom global flag to determine whether the modal has been opened or not and I reset it on 'hidden.bs.modal'
On bootstrap-modal.js v2.2.0:
( $('element').data('modal') || {}).isShown
You can use
$('#myModal').hasClass('in');
Bootstrap adds the in
class when the modal is open and removes it when closed
Check if a modal is open
$('.modal:visible').length && $('body').hasClass('modal-open')
To attach an event listener
$(document).on('show.bs.modal', '.modal', function () {
// run your validation... ( or shown.bs.modal )
});
You can also directly use jQuery.
$('#myModal').is(':visible');
$("element").data('bs.modal').isShown
won't work if the modal hasn't been shown before. You will need to add an extra condition:
$("element").data('bs.modal')
so the answer taking into account first appearance:
if ($("element").data('bs.modal') && $("element").data('bs.modal').isShown){
...
}
Source: Stackoverflow.com