I am using Twitter's Bootstrap modal.
The modal is dismissed whenever the user clicks anywhere else on the screen except the modal.
Is there a way I can prevent this, so the user has to click the Close button to dismiss the modal?
Best,
When the Button is clicked, the HTML DIV is referenced using jQuery and its modal function is called along with properties data-backdrop: "static" and data-keyboard: false which disables the closing of the Bootstrap Modal Popup when clicked outside.
To prevent closing bootstrap modal when click outside of modal window we need add properties data-backdrop="static" and data-keyboard="false" to button which we are using to show modal window like as shown following.
The goal is to submit the data to our db when the submit button is clicked and then hide the form and display a thank you within the same modal. Here's the basics of the code for the modal: <div class="modal fade" id="formModal" tabindex="-1" role="dialog" aria-labelledby="formModalLabel" aria-hidden="true">
Answer: Use the modal('hide') Method You can simply use the modal('hide') method to hide or close the modal window in Bootstrap using jQuery. Other related Bootstrap's modal methods are modal('show') and modal('toggle') .
In most cases, the modal dialog is constructed not using Javascript, rather it's using the markup, in this scenario, just add attribute: data-backdrop="static" in the div that has class="modal fade".
Example:
<div class="modal fade" id="myModal" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With