We are recently migrated to the new theme. Popup goes off when clicking outside the modal popup window. Below is the code to open the model. Please help.
$("#testDialog").modal("show");
<div class="modal fade" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="staticBackdrop" >...</div>
This seems to be an issue now. I tried with most of the js and css files which downloaded , however popup still disappears if click out side. I exactly did the same as in the document, but no luck. If needed, I can send the files which I am testing for this. Please let me know. This is really a headache now.
Have you tried to use data-bs-backdrop="static" data-bs-keyboard="false"
attributes to show a modal with static backdrop ?
yes, I tried and working. Thank you.
https://imgur.com/WtHjXIj
this is the html
Below is the full html ...
<!DOCTYPE html>
<html >
<link href="style.bundle.css" rel="stylesheet" type="text/css">
<script src="plugins.bundle.js"></script>
<body>
<input type="button" onclick='openModal();' value="open">
<script>
function openModal()
{
$("#staticBackdrop").modal('show');
}
</script>
<!-- Modal-->
<div class="modal fade" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="staticBackdrop" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" >Modal Title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<i aria-hidden="true" class="ki ki-close"></i>
</button>
</div>
<div class="modal-body">
... Testing only....
</div>
<div class="modal-footer">
<button type="button" class="btn btn-light-primary font-weight-bold" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary font-weight-bold">Save changes</button>
</div>
</div>
</div>
</div>
</html>
Hi,
Could you please clarify? Which popup are you using? SweetAlert ?
Can you please send us some screenshots via using https://imgur.com ?
Regards
Hi
https://imgur.com/7ZhD30o
This is the modal I am using. But when I click outside the popup , it goes off. I want the popup there evenif user click outside the popup. I added data-backdrop="static" property, but it is not working . I am using the purchased version of plugins.bundle.js file. But in the demo site, it is working fine. Do I need to change the js file ?
thanks
Suresh
Hi,
You will need to use Bootstrap 5 new attributes data-bs-backdrop="static" data-bs-keyboard="false"
attributes to show a modal with static backdrop as explained in the Modal documentation.
Regards.
Thank you... This is working...