?
Solved

Fancybox appears on successful form submit

Posted on 2013-06-24
8
Medium Priority
?
746 Views
Last Modified: 2013-07-11
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
0
Comment
Question by:djfenom
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 3
8 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 39271292
Either use e.preventDefault() at the beginning or use return false at the end, in your validate function.
0
 

Author Comment

by:djfenom
ID: 39271368
e.preventDefault() submits the form without the fancybox and return false appears to do nothing.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39271430
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
Python: Series & Data Frames With Pandas

Learn the basics of Python’s pandas library of series & data frames and how we can use these tools for data manipulation.

 

Author Comment

by:djfenom
ID: 39271469
Yes, it basically just fires a trigger to open it automatically.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39272007
You seem to have some conflicts with scripts.js and jquery.validate.js and fancybox.
Trying to find it now.
0
 
LVL 58

Accepted Solution

by:
Gary earned 1500 total points
ID: 39272047
In scripts.js you have
$("#frmreg").validate();

frmreg doesn't exist - this breaks the js
0
 

Author Comment

by:djfenom
ID: 39274072
I've taken that line out and it's still the same?
0
 
LVL 58

Expert Comment

by:Gary
ID: 39274834
It works fine for me - I get the fancybox.
0

Featured Post

Stack Overflow Podcast - Developer Story

Welcome to the Stack Overflow podcast recorded Thursday July 20 at Stack Overflow Headquearters in NYC. Your hosts today are podcast regulars Jay Hanlon, David Fullerton, and Ilana Yitzhaki, plus the quite irregular Matt Sherman (Stack Overflow Engineering Manager extraordinaire)

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

764 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question