Bootstrap Model not showing properly
<p>The Same code I have in my Page. Whenever i am clicking on the button, the model get call and shows the model dialogbox just for few seconds and then become invisable.</p>



<pre><code>&lt;button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal"&gt;Open Modal&lt;/button&gt;

&lt;!-- Modal --&gt;
&lt;div class="modal fade" id="myModal" role="dialog"&gt;
    &lt;div class="modal-dialog"&gt;

&lt;!-- Modal content--&gt;
&lt;div class="modal-content"&gt;
    &lt;div class="modal-header"&gt;
        &lt;button type="button" class="close" data-dismiss="modal"&gt;&amp;times;&lt;/button&gt;
    &lt;h4 class="modal-title"&gt;Modal Header&lt;/h4&gt;
    &lt;/div&gt;
    &lt;div class="modal-body"&gt;
        &lt;p&gt;Some text in the modal.&lt;/p&gt;
    &lt;/div&gt;
    &lt;div class="modal-footer"&gt;
        &lt;button type="button" class="btn btn-default" data-dismiss="modal"&gt;Close&lt;/button&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<hr>

<pre><code>&lt;td class="text-center"&gt;&lt;a class="btn glyphicon glyphicon-trash delete" &gt;&lt;/a&gt;&lt;/td&gt;
&lt;div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&gt;
&lt;div class="modal-dialog"&gt;
    &lt;div class="modal-content"&gt;
        &lt;div class="modal-header"&gt; Confirm Delete &lt;/div&gt;
        &lt;div class="modal-body"&gt;
            Are you sure you want to Delete  contact list ?
        &lt;/div&gt;
        &lt;div class="modal-footer"&gt;
            &lt;button type="button" class="btn btn-default" data-dismiss="modal"&gt;Cancel&lt;/button&gt;
            &lt;a  id="sureDelete"&gt;&lt;button  class="btn btn-danger success"&gt;Delete&lt;/button&gt;&lt;/a&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p></p>