asked on

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('&pound;' + (+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

Gary

Either use e.preventDefault() at the beginning or use return false at the end, in your validate function.

djfenom

ASKER

e.preventDefault() submits the form without the fancybox and return false appears to do nothing.

Gary

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
      });

djfenom

ASKER

Yes, it basically just fires a trigger to open it automatically.

Gary

You seem to have some conflicts with scripts.js and jquery.validate.js and fancybox.
Trying to find it now.

ASKER CERTIFIED SOLUTION

Gary

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

djfenom

ASKER

I've taken that line out and it's still the same?

Gary

It works fine for me - I get the fancybox.