CODEWITHSUNDEEP
javascriptjqueryhtmltwitter-bootstrapbootstrap-modal
Ashe
Ashe

Reputation: 187

How to make a bootstrap modal window close when click outside again?

I'm working in a project using bootstrap framework and I read there are different ways to open a modal window, in my case I open it with javascript with this code:

$('#formVenta').modal({backdrop: 'static', keyboard: false});

I did this because the client asked me to avoid close the modal when click outside but now he wants to press click outside and close the modal again but when there is no content inside a specific div inside my window

<div id="content_goes_here"></div>

I think to solve this in this way

$(document).click(function(e) {

        //check if modal is open
        if ($('#formVenta').is(':visible')) {

            //check if div has content
            if ($('#content_goes_here').html().length > 0) {

                //do something
            }
        }
    });

The problem I see is that there are text input outside that div and If I want to search something it will close when I make click in the input because there will be not content yet inside the div and I want to avoid this issue.

Is there a way where only when I make click outside the modal window check if the div is empty and make the opposite of the way I opened the window in this case the opposite of this?

$('#formVenta').modal({backdrop: 'static', keyboard: false});

for example change the value of the property backgrop.

I hope you can help me, thanks.

Upvotes: 0

Views: 617

Answers (1)

Andrei
Andrei

Reputation: 1216

sorry it took a while to find the right properties but here is the best example

$('#formVenta').data('bs.modal').options.backdrop = false; or $('#formVenta').data('bs.modal').options.backdrop = static;

you can take a look at the current properties you have set by doing alert(JSON.stringify($('#myModal3').data('bs.modal').options)); or change the alert to console.log()

so you can put an event on the div for when it changes to run the validation function and inside of the validation function you can change the options of the modal with the above code

Upvotes: 1

Related Questions