Fancybox appears on successful form submit

I have a form on my website which if all the correct fields are filled out and the credit card type is selected should open up a fancybox, but for some reason it's not working.

My site is here - http://www.urlgone.com/d391ad/

This is my form validation script:

$("#form1").validate(
	{
		errorLabelContainer: $(".errors"),
		rules: {
			totalSum: {
				required: true,
				min: 1,
				number: true
			}
		},
		invalidHandler: function(form, validator){ 
		$.scrollTo( '#form1', "slow");
     }, 
	  submitHandler: function(form) {
		  if ($("#credit").attr("checked")) {
			var tot = $("#totalSum").val();
			var charge = ((tot / 100) * 2.75).toFixed(2);
			$(".cc-tot").html('£' + (+tot + +charge));
			$("#trigger").fancybox({
				closeClick  : false,
				helpers     : { 
				overlay		: {closeClick: false}
				}
			}).trigger('click');
		  } else {
			form.submit();
		  }
		},
     focusInvalid:false
	});

Open in new window


Can anyone please help?

Thanks,

Chris
djfenomAsked:
Who is Participating?
 
GaryConnect With a Mentor Commented:
In scripts.js you have
$("#frmreg").validate();

frmreg doesn't exist - this breaks the js
0
 
GaryCommented:
Either use e.preventDefault() at the beginning or use return false at the end, in your validate function.
0
 
djfenomAuthor Commented:
e.preventDefault() submits the form without the fancybox and return false appears to do nothing.
0
Cloud Class® Course: Microsoft Windows 7 Basic

This introductory course to Windows 7 environment will teach you about working with the Windows operating system. You will learn about basic functions including start menu; the desktop; managing files, folders, and libraries.

 
GaryCommented:
Ok
Your fancybox is just?
<a id="trigger" href="#cc-warning"></a>

I'm not familiar with appending a trigger to the fancybox, normal usage is just
      $("#trigger").fancybox({
            // effects etc
      });
0
 
djfenomAuthor Commented:
Yes, it basically just fires a trigger to open it automatically.
0
 
GaryCommented:
You seem to have some conflicts with scripts.js and jquery.validate.js and fancybox.
Trying to find it now.
0
 
djfenomAuthor Commented:
I've taken that line out and it's still the same?
0
 
GaryCommented:
It works fine for me - I get the fancybox.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.