set partial view inside bootstrap modal window

Question

I have partial view like

<div data-id="myModal" class="modal" tabindex="-1" role="dialog">
   ....
   some content
</div>

How can I on page load set this partial inside modal bootstrap window I tried with

$(document).ready(function () {
      $('#myModal').modal('show');
});

but that doesn't work

Answer 1

Change

<div data-id="myModal" class="modal" tabindex="-1" role="dialog">

to

<div id="myModal" class="modal" tabindex="-1" role="dialog">

Answer 2

To apply modal to html, first you must render html partial on page and then you can call your javascript like so:

@{Html.RenderPartial("~/Views/Shared/partial/myModal.cshtml");}

<script type="javascript">
    $(document).ready(function () {
      $('#myModal').modal('show');
    });
</script>

You may consider set a proper id for your modal id="myModal" instead of data-id="myModal" .