Modal event shown.bs.modal is not fired if a remote URL is provided

[iainheng]

Modal event shown.bs.modal is not fired when a remote URL is provided.

I have the modal container in

<div id="variant-modal" class="modal fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>

And a button

<a id="add-variant" class="btn btn-default" data-target="#variant-modal" data-toggle="modal" href="remote.php">Add a variant</a>

and the return data from the remote.php is

<div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">x</button>
                <h4 class="modal-title">Modal title</h4>
            </div>
            <div class="modal-body">some simple test</div>
            <div class="modal-footer">
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->

and I listen the shown.bs.modal as below

    $('#variant-modal').on('shown.bs.modal', function () {
        alert("shown");
    });

But the event shown.bs.modal is not fired. It is working fine when there is no remote URL though.

However, I tried event show.bs.modal and it get called everytime even though it load the content from the remote URL.

[Subtletree]

Pull request #9975 is working towards fixing this

[bogatykh]

I can reproduce this error too. shown.bs.modal is not fired with remote url specified.

[fat]

oh rough. i think the right fix for this is changing where the remote url loads content into… but that breaks backwards compat…

[fat]

i could hack a fix by kinda dont want to

[glyebov]

Just in case somebody still need a solution. Thanx to bootstrap 3. Remove class "fade" from modal container. Seems modal() does not fire shown.bs.modal event after animation.