How to load a jquery popup in successful completion of form

[davelearning]

Hi all,

 

I have the below script which uses jquery to display a modalbox when I link is clicked on, which works fine!

<script>
$(document).ready(function() 
{	
$('a[name=modal]').click(function(e) 
	{
		e.preventDefault();
		var id = $(this).attr('href');
		var maskHeight = $(document).height();
		var maskWidth = $(window).width();
		$('#mask').css({'width':maskWidth,'height':maskHeight});
		$('#mask').fadeIn(1000);	
		$('#mask').fadeTo("slow",0.;	
		var winH = $(window).height();
		var winW = $(window).width();
		$(id).css('top',  winH/2-$(id).height()/2);
		$(id).css('left', winW/2-$(id).width()/2);
		$(id).fadeIn(2000); 
	});

$('.window .close').click(function (e) 
{
	e.preventDefault();
	$('#mask').hide();
	$('.window').hide();

});		

$('#mask').click(function ()
 {
	$(this).hide();
	$('.window').hide();
});			
});
</script>

 

However what I would like to do is have a modal box popup when a user registers, basically they will be redirected to the index page, where they should have this popup come up, just with a message telling them that their registration was succesful blah blah.

 

The script is currently called by doing this:

<a href="#dialog"  name="modal">Login</a>

 

Where the div id dialog contains the data to be loaded into the popup.

 

How would I do this?

 

Thanks

 

 

[trq]

You should take a look at http://jqueryui.com/demos/dialog/

[davelearning]

Thanks,

 

however as soon as pop this into my code, it stops all my other jquery working (eg the above for my popup login box!)

<script>
$(function() {
	$( "#messagefailed" ).dialog();
});
</script>

 

[trq]

Have you installed jquery ui?

[davelearning]

Hi Thorpe, yup, just realised that I hadn't included the .css file, that leads to the rest of my code working again, however nothing pops up when I refresh the page/

<script>
$(function() {
	$( "#dialog" ).dialog();
});
</script>

 

and

<div id="dialog">Popup test</div>

 

 

 

 

 

 

[davelearning]

Hi Thorpe, yup, just realised that I hadn't included the .css file, that leads to the rest of my code working again, however nothing pops up when I refresh the page/

<script>
$(function() {
	$( "#dialog" ).dialog();
});
</script>

 

and

<div id="dialog">Popup test</div>

 

Got it now!

<script>
$(function() {
	$( "#dialog" ).dialog();
modal: true
});
</script>