Jump to content

Modal form on startup

Recommended Posts

Hi all, I'm using a simple example template from Bootstrap and wish to display a modal form when the page loads. I have the code below direct from bootstrap to load the modal form when a button is pressed, but i've tried a few other things to get the modal to appear on load, but none of which is working. I'm sure its something simple, but this is a learning curve for me, so any help appreciated. Code I've got from Bootstrap:

<!-- Button to trigger modal --><a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a> <!-- Modal --><div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">  <div class="modal-header">	<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>	<h3 id="myModalLabel">Modal header</h3>  </div>  <div class="modal-body">	<p>One fine body…</p>  </div>  <div class="modal-footer">	<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>	<button class="btn btn-primary">Save changes</button>  </div></div>

I've tried using the following to get it to load on the form load:



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

neither of which I can seem to get to work. Cheers Col

Share this post

Link to post
Share on other sites

do you have any documentation for this? Are you sure you are implementing the toggle correctly? Are you checking for errors in the console? Biggest thing I see is you trying to reference by the id myModal, but you put that value as the href instead, not sure if that is consistent with the interface, but the documentation would clear that up.

Share this post

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Create New...