Jump to content

Modal form on startup


m0atz
 Share

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:

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

and

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

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

Link to comment
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.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...