Bootstrap 3 / showing modal doesn't work with the javascript way

Question

I use the Modal feature from Bootstrap 3.0.

I have this code:

<a data-toggle="modal" href="/myNestedContent" data-target="#myModal">
  Open the modal containing the content
</a>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
//nested content will be inserted here
</div>

When I click on the anchor (the link), the whole works => I see the modal with the content.

However, when I use the Javascript way (instead of the link) to show the modal like this:

$('#myModal').modal('show'); 

I only see the fade effect without the modal being shown...

When I started by clicking on the link, THEN calling the javascript, it works. (side effect?)

When I started by the javascript way, EVEN the link only shows the fade effect without the modal.

Might it be .. a bug from the modal Javascript method?

For information, the declarations of my scripts that I use are in the right order:

<script src="//code.jquery.com/jquery.js"></script>
<script src="javascripts/jquery.form.min.js"></script> 
<script src="javascripts/bootstrap.min.js"></script>

Answer 1

i am not sure if i have misunderstood your question.

According to my understanding of your question, you need

$('#myModal').modal({
    show: true,
    remote: '/myNestedContent'
});

you cannot just

$('#myModal').modal('show'); 

because there is no url provided in this js method.

does this solve your question?