Warm tip: This article is reproduced from serverfault.com, please click

bootstrap modal closes when ok on alert() is clicked

发布于 2017-06-15 11:20:04

Bootstrap modal is closing when I click on "Ok" button showing from "alert()" function.

$("#expample").modal({
    backdrop: 'static',
    keyboard: false,
    show: true
});

Below is my jquery:

$('.sendToUser').on('click', function (){
            var selectedLyrics = $('#selectedLyricsInput').val();
            if($("input[name='selectUserRadio']").is(":checked") == false){
                alert('Please, select a user to send.');
                return;
            }
        });

Although, hitting "Enter" or "Esc" on keyboard is working fine and also, clicking outside the modal; the modal is not closing which is fine.

Below is my html:

<div class="modal fade" id="userSelectionModal" tabindex="-1" role="dialog" aria-labelledby="userSelectionModal">
    <div class="modal-dialog modal-likes" role="document">
        <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">Select User</h4>
            </div>

            <div class="modal-body">
                <div style="margin-bottom: 50px;" id="populateUsers">

                </div>
                <input type="hidden" id="selectedLyricsInput" value="" />
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-success sendToUser" data-dismiss="modal">Send</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
            {{--<i class="fa fa-spinner fa-spin"></i>--}}
        </div>
    </div>
</div>

I am creating an alert popup from an event on the modal but when clicked on the "ok" of the alert() popup, it disappears.

How to prevent closing of the modal after clicking on "OK" on the alert popup?

Thanks

Questioner
Owais
Viewed
0
Stanislav Kvitash 2017-06-15 19:36:05

Your modal is closing, because you have data-dismiss="modal" attribute on the .sendToUser button. Removing this attribute should prevent the modal from closing.