Geek Answers Handbook

Static background change for open boot modal

Is it possible to change the background to “static” while my modal is open?

I have a modal submit form button. When I click this button, I show the bootloader on my modal, and this is the moment when I want to change the background to static

I tried $('#myModal').modal({backdrop: 'static', keyboard: false}) , but I can still close my modal file by clicking on the background or using the escape button.

The second step should be replaced back to true, but I have not tried this yet, because first I need to set the fold to statics.

I could set a fold for static display in a modal show, but I want to avoid this and change it after sending.

Any ideas?

+7
source share
5 answers

Ok, I solved it. This may not be the best solution, but it works for my special case.

I added $('#myModal').off('click'); right after i show spinner loading on submit. This prevents the modal mouse click from closing.

There was a problem disabling the escape button because browsers stop loading the page when the user clicks this button. So I decided to hide the counter in order to unlock the form using this code:

 $(document).on('keydown',function(e) { if (e.keyCode == 27) { $('#myLoadingSpinner').hide(); } });


Edit: I found another solution for the background:

 $('#myModal').data('bs.modal').options.backdrop = 'static';

I tried this also for keyboard = false , but it does not work.

+6
source

You can prevent the modal window from closing when you click on it, as well as on the esc button. For example, if your modal identifier is signUp :

 jQuery('#signUp').on('shown.bs.modal', function() { jQuery(this).data('bs.modal').options.backdrop = 'static'; jQuery(this).data('bs.modal').options.keyboard = false; });
+1
source

The simplest method I came up with is the hide.bs.modal event and the call to preventDefault() . This does not allow you to technically set the focus to static, but it provides the same effect in a switchable form.

 let $myModal = $('#myModal'); function preventHide(e) { e.preventDefault(); } // if you have buttons that are allowed to close the modal $myModal.find('[data-dismiss="modal"]').click(() => $myModal.off('hide.bs.modal', preventHide)); function disableModalHide() { $myModal.on('hide.bs.modal', preventHide); } function enableModalHide() { $myModal.off('hide.bs.modal', preventHide); }

(Disclaimer, I have not tested buttons that allow modals to be hidden, as this is not my scenario. If this does not work, just call .modal('hide') from the click() callback.)

0
source

I had a modal that could be opened in two different ways. When the user opened it in one way, I wanted him to be able to close the modal window. When they opened it, I did not want them to be able to close it.

I found this question and used the solution of the original poster. I also tried adding a keyboard that now works:

 $('#myModal').data('bs.modal').options.backdrop = 'static'; $('#myModal').data('bs.modal').options.keyboard = false;
0
source

Another JavaScript object was returned to me, and thus the following solution:

 $myModal.data("bs.modal")._config.backdrop = value;
0
source

More articles:


All Articles