forum

home / developersection / forums / how to disable click outside of bootstrap modal area to close modal?

Ask Question

How to Disable click outside of bootstrap modal area to close modal?

Manish Kumar 2371 22-May-2017
I am designing a website through bootstrap, with a couple of Bootstrap 'Modals'. I have Problem, I can close the modal by clicking on the background. Is there any way to disable this feature?
Please help!!!
c# mvc4  bootstrap modal 
Updated on 23-May-2017
Manish Kumar

Other

Follow
Can you answer this question?
Answer

1 Answers

Jayden Bell

Jayden Bell

23-May-2017


If you opening the modal by js, use:

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

 

 

If you are using data attributes, use:

 

<div id="Mymodal-Create" class="modal fade
bd-example-modal-lg"
tabindex="-1" role="dialog" data-backdrop="static" data-keyboard="false" aria-labelledby="myLargeModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                            &times;
                        </button>
                        <h4 class="modal-title">Create
                        </h4>
                    </div>
                    <div class="modal-body" id="Create-Body">
                    </div>
 
                    <div class="modal-footer">
                        <input type="Submit" class="btn
btn-primary"
id="btnsubmit"  value="Add" />
                        <button type="button" class="btn
btn-default"
data-dismiss="modal">
                            Close
                        </button>
 
                    </div>
 
                </div>
                <!-- /.modal-content
-->
            </div>
            <!-- /.modal-dialog -->
 
        </div>

 

 

MindStick Training
MindStick Training

Liked By

We use cookies to ensure you have the best browsing experience on our website. By using our site, you acknowledge that you have read and understood our Cookie Policy & Privacy Policy