?
Solved

wordpress plugin: gravity forms: modal overlay for confirmation

Posted on 2014-10-14
10
Medium Priority
?
1,873 Views
Last Modified: 2014-10-24
I've just heard back from gravity forms support and they say there is no solution for a modal overlay for the confirmation message.  I'm looking for someone with gravity forms experience that has successfully created this overlay. Any ideas?
0
Comment
Question by:phillystyle123
[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
  • 2
10 Comments
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 40381379
I can't find a code sample for confirmation after submission but at least one person figured it out:

https://www.screenr.com/n32

But no code :(

So what I THINK is going on in the screencast above is the author is using the gform_after_submission() action hook to fire a function that triggers the modal, perhaps similar to this WPBeginner tutorial:

http://www.wpbeginner.com/wp-tutorials/how-to-use-javascript-popups-to-display-gravity-forms-error-messages/

But I can't find a complete, working code sample either and it appears no one has written an extension to GF for this either.
0
 
LVL 14

Accepted Solution

by:
Dzynit earned 2000 total points
ID: 40383056
Using the info that Jason gave you, I tried and tested this:

add_filter( 'gform_after_submission', 'sw_gf_thanks_message', 10, 2 );

function sw_gf_thanks_message( $thx_message ) {
	add_action( 'wp_footer', 'sw_gf_thx_msg' );
}
function sw_gf_thx_msg() { ?>
	<script type="text/javascript">
		alert( "Thank you for contacting us." );
	</script>
<?php }

Open in new window


I'm sure you could expand on the alert box section to have it auto close etc. and in the gform settings you could choose to have it reload the page your form is on.
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 40383156
And now you know who is lazier between myself and Dyznit.

(hint: It's not Dyznit)
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 14

Expert Comment

by:Dzynit
ID: 40383175
lol, Jason - you did the hard part, finding the right info to make it work. I think they still want it to work a little fancier than that, but that should be a good start. What's crazy is that I set up exactly what is being asked for here earlier this year, but for the life of me - I can't remember what site it was on to find and grab the code ;)
0
 

Author Comment

by:phillystyle123
ID: 40389124
wow -thanks so much for the input guys. i will test. So, i just put Dzynit's code  in my theme's functions.php code, and that's it?
0
 
LVL 14

Expert Comment

by:Dzynit
ID: 40389166
Yes, then test your form and you can edit the alert part of code from there. That's a javascript alert box, so if you want to fancy it up more, you can check out the additional things you can add and you can see easily how you edit the message shown.
0
 

Author Comment

by:phillystyle123
ID: 40389403
Just tried it - added the code to my functions.php file. I'm already using another gravity filter, so I know they work. This one isn't generating the overlay though. I'm redirected to the thankyou message I have set in the form confirmation section. There are three confirmation types: Text, Page, Redirect. One has to be selected. I've got Text selected.
0
 
LVL 14

Expert Comment

by:Dzynit
ID: 40390344
When I tested it, that's also what I selected - the text option. Did you notice if when you tested the form if the browser showed any jquery or javascript errors? This function adds the javascript to the footer, but if there's an error in another script before this one loads, it won't be able to run.

When you say you're already using another gravity filter, which filter are you using in case maybe the two can't be used at the same time.

I tested it before posting, so I would have to guess that there's a conflict or error happening somewhere along the way.
0
 

Author Comment

by:phillystyle123
ID: 40390378
I bet that's correct Dzynit. I've got js in my footer and jquery running already. I'll have to test. thanks for the help.
0
 
LVL 14

Expert Comment

by:Dzynit
ID: 40390389
Sure thing. I run into that a lot when a site uses a lot of jquery and javascripts and it does get frustrating. To help test, you could try change the add_action( 'wp_footer' to add_action( 'wp_head' in this function and see if there's a difference. If there's a conflict, then you might be able to pinpoint which other script is causing it.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
The purpose of this video is to demonstrate how to add AdSense Ads to a WordPress Website, and how to set up WordPress to automatically place Ads in Sidebars. This will be demonstrated using a Windows 8 PC. Log into your AdSense account. : Cli…
The purpose of this video is to demonstrate how to set up an RSS Feed on a WordPress Website. This will be demonstrated using a Windows 8 PC. Feedburner will be used for this demonstration. Go to your WordPress login page. This will look like the…
Suggested Courses
Course of the Month10 days, 12 hours left to enroll

765 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