Gravity Wiz

Magically enhanced tutorials, snippets and plugins for Gravity Forms!

  • Gravity Perks
    • Gravity Perks
    • Tutorials & Snippets
    • About
  • Support
    • Documentation
    • Support
    • Account

Better Pre-submission Confirmation

Last updated August 21, 2019 | Written by David Smith 564 Comments

  • September 10, 2014: Fixed issue where init() was not a static function.

  • September 11, 2013: Updated to fix issue where Total field merge tags were not displaying due to GFCache issue.

  • May 22, 2013: Updated to support :noadmin filter on the {all_fields} merge tag.

  • February 13, 2013: Updated to fix issue where specify individual input merge tag (ie First Name of a Name field: {Name (First):4.3}) was returning the full field value instead of the individual inputs value.

  • Updated on December 4th, 2012 to pass the correct number of variables to the preview_special_merge_tags function.

Show All Updates

Stop! There's a better way.

This snippet is available as a plugin with Gravity Perks, a suite of over 33 premium Gravity Forms plugins!

  • View the Plugin
  • Buy Gravity Perks

Are you interested in adding a quick pre-submission confirmation page to your forms where users can preview their entered data before it is submitted? Gravity Forms does not provide any way to do this by default; however, with a bit of custom code and a few simple form configuration instructions, you’ll have pre-submission confirmations working like magic!

One of the big things missing from the Simple Pre-submission Confirmation was support for Gravity Form merge tags. With some recent changes to Gravity Forms, supporting this in HTML fields became a lot easier.

  1. The Code
  2. The Form

Let’s dig in!

Step 1: The Code

The following code can be copied and pasted into your theme’s functions.php file.

View DemoShow CodeDownload Code
<?php
/**
* Better Pre-submission Confirmation
* http://gravitywiz.com/2012/08/04/better-pre-submission-confirmation/
*/
class GWPreviewConfirmation {
private static $lead;
public static function init() {
add_filter( 'gform_pre_render', array( __class__, 'replace_merge_tags' ) );
}
public static function replace_merge_tags( $form ) {
if( ! class_exists( 'GFFormDisplay' ) ) {
return $form;
}
$current_page = isset(GFFormDisplay::$submission[$form['id']]) ? GFFormDisplay::$submission[$form['id']]['page_number'] : 1;
$fields = array();
// get all HTML fields on the current page
foreach($form['fields'] as &$field) {
// skip all fields on the first page
if(rgar($field, 'pageNumber') <= 1)
continue;
$default_value = rgar($field, 'defaultValue');
preg_match_all('/{.+}/', $default_value, $matches, PREG_SET_ORDER);
if(!empty($matches)) {
// if default value needs to be replaced but is not on current page, wait until on the current page to replace it
if(rgar($field, 'pageNumber') != $current_page) {
$field['defaultValue'] = '';
} else {
$field['defaultValue'] = self::preview_replace_variables($default_value, $form);
}
}
// only run 'content' filter for fields on the current page
if(rgar($field, 'pageNumber') != $current_page)
continue;
$html_content = rgar($field, 'content');
preg_match_all('/{.+}/', $html_content, $matches, PREG_SET_ORDER);
if(!empty($matches)) {
$field['content'] = self::preview_replace_variables($html_content, $form);
}
}
return $form;
}
/**
* Adds special support for file upload, post image and multi input merge tags.
*/
public static function preview_special_merge_tags($value, $input_id, $merge_tag, $field) {
// added to prevent overriding :noadmin filter (and other filters that remove fields)
if( ! $value )
return $value;
$input_type = RGFormsModel::get_input_type($field);
$is_upload_field = in_array( $input_type, array('post_image', 'fileupload') );
$is_multi_input = is_array( rgar($field, 'inputs') );
$is_input = intval( $input_id ) != $input_id;
if( !$is_upload_field && !$is_multi_input )
return $value;
// if is individual input of multi-input field, return just that input value
if( $is_input )
return $value;
$form = RGFormsModel::get_form_meta($field['formId']);
$lead = self::create_lead($form);
$currency = GFCommon::get_currency();
if(is_array(rgar($field, 'inputs'))) {
$value = RGFormsModel::get_lead_field_value($lead, $field);
return GFCommon::get_lead_field_display($field, $value, $currency);
}
switch($input_type) {
case 'fileupload':
$value = self::preview_image_value("input_{$field['id']}", $field, $form, $lead);
$value = self::preview_image_display($field, $form, $value);
break;
default:
$value = self::preview_image_value("input_{$field['id']}", $field, $form, $lead);
$value = GFCommon::get_lead_field_display($field, $value, $currency);
break;
}
return $value;
}
public static function preview_image_value($input_name, $field, $form, $lead) {
$field_id = $field['id'];
$file_info = RGFormsModel::get_temp_filename($form['id'], $input_name);
$source = RGFormsModel::get_upload_url($form['id']) . "/tmp/" . $file_info["temp_filename"];
if(!$file_info)
return '';
switch(RGFormsModel::get_input_type($field)){
case "post_image":
list(,$image_title, $image_caption, $image_description) = explode("|:|", $lead[$field['id']]);
$value = !empty($source) ? $source . "|:|" . $image_title . "|:|" . $image_caption . "|:|" . $image_description : "";
break;
case "fileupload" :
$value = $source;
break;
}
return $value;
}
public static function preview_image_display($field, $form, $value) {
// need to get the tmp $file_info to retrieve real uploaded filename, otherwise will display ugly tmp name
$input_name = "input_" . str_replace('.', '_', $field['id']);
$file_info = RGFormsModel::get_temp_filename($form['id'], $input_name);
$file_path = $value;
if(!empty($file_path)){
$file_path = esc_attr(str_replace(" ", "%20", $file_path));
$value = "<a href='$file_path' target='_blank' title='" . __("Click to view", "gravityforms") . "'>" . $file_info['uploaded_filename'] . "</a>";
}
return $value;
}
/**
* Retrieves $lead object from class if it has already been created; otherwise creates a new $lead object.
*/
public static function create_lead( $form ) {
if( empty( self::$lead ) ) {
self::$lead = GFFormsModel::create_lead( $form );
self::clear_field_value_cache( $form );
}
return self::$lead;
}
public static function preview_replace_variables( $content, $form ) {
$lead = self::create_lead($form);
// add filter that will handle getting temporary URLs for file uploads and post image fields (removed below)
// beware, the RGFormsModel::create_lead() function also triggers the gform_merge_tag_filter at some point and will
// result in an infinite loop if not called first above
add_filter('gform_merge_tag_filter', array('GWPreviewConfirmation', 'preview_special_merge_tags'), 10, 4);
$content = GFCommon::replace_variables($content, $form, $lead, false, false, false);
// remove filter so this function is not applied after preview functionality is complete
remove_filter('gform_merge_tag_filter', array('GWPreviewConfirmation', 'preview_special_merge_tags'));
return $content;
}
public static function clear_field_value_cache( $form ) {
if( ! class_exists( 'GFCache' ) )
return;
foreach( $form['fields'] as &$field ) {
if( GFFormsModel::get_input_type( $field ) == 'total' )
GFCache::delete( 'GFFormsModel::get_lead_field_value__' . $field['id'] );
}
}
}
GWPreviewConfirmation::init();
view raw gw-gravity-forms-better-pre-submission-confirmation.php hosted with ❤ by GitHub

This code provides the ability to use Gravity Form merge tags in an HTML field on the final page of your form, allowing users to preview their data before submission. Since you can now use merge tags, there is no need for the old shortcode method from the previous version of this snippet.

Step 2: The Form

With the code in place, it’s time to configure the form. The first thing we’ll need to do is add a page at the end of the form for the pre-submission confirmation. You can do this using the Page Break field type.

Next add an HTML field from the “Standard Fields” section. I renamed my HTML field “Confirmation”. Your page should now look something like this:

Pre-submission Confirmation Page Configuration

Go ahead and select the HTML field for editing. The “Content” setting of this field now supports all merge tags like {Name (First):4}, {Question:5}, and even more advanced merge tags like {all_fields}. How about that!

You can see exactly what this content generates by submitting the demo form here.

The previous version of this snippet allowed you to put content inside a [gform_preview] shortcode and only display that content if a specified value exists. We’ve dropped support for that in favor of using Gravity Forms default conditional shortcode

Summary

Let me know how this new code works out for you!

The Saved Forms add-on by soulseekah has been updated to work with this snippet. Make sure you get the latest version of the Saved Forms add-on.

Did this resource help you do something awesome with Gravity Forms? Then you'll absolutely love Gravity Perks; a suite of 32+ essential add-ons for Gravity Forms with support you can count on.

  • View All Perks
  • Buy Gravity Perks

Filed Under: Tutorials

Comments

  1. Stephane JERSOL says

    March 3, 2020 at 12:38 pm

    Hello, I have a Gravity forms with a lot of fields and I would like to display a specific field on a specific page of my website. For example : on my home page : I would liket to display field number 1, 2 and 3 (ID field) and on an another page I would like to display only the field with ID 7. I tried this shortcode : [gravityform id="1" title="false" description="false" ajax="true" tabindex="1" field_values="check=First Choice,Second Choice" field_id=7] but it is not working. Any idea ? Thank you so much for you rhelp

    Reply
    • Ryan Donovan says

      March 3, 2020 at 2:20 pm

      Hello Stephane, this is an interesting question and we would love to take a look at your setup! Could you please drop us a support request so we could get to the bottom of this one for you. 😁

  2. ANTONIS T. says

    November 8, 2019 at 12:18 am

    Hi David, i want to use this nice plugin. i want το customize the preview by using the individual field merge tags. Μy guestion is , is it possible, the preview not to be all in one line. I want like a letter, with spaces between the field merge tags, and is some cases to be in one line down. (such as thanks/apology letter for example) I will not use labels

    thank a lot Antonis

    Reply
    • David Smith says

      November 15, 2019 at 12:52 pm

      Hi Antonis, if you’re using the individual merge tags, you will need to use HTML

      <

      p> and
      tags to add space between the fields as desired.

    • ANTONIS T. says

      November 30, 2019 at 1:21 am

      thanks for your help i really appreciate, one more question…very important for the form i want to create with gravity…

      the Submission Preview is it possible to be in the same page with the fileds, and not in a separate page? so the users dont have do press button for next page (in order to make changes in the forms) .

    • David Smith says

      November 30, 2019 at 7:28 am

      If you need it on the same page, I would recommend going with Populate Anything which supports Live Merge Tags. Live Merge Tags are replaced as the user types.

  3. Daniel Lott says

    October 2, 2019 at 5:11 am

    Hi David I have a long complicated form with various fields being displayed depending on what the user has input in other fields etc. Some of the these hidden fields have default values in. How can I preview ONLY the fields that are visible? Ive tried the snippet you linked to but that didnt work. Thanks

    Reply
    • dl292 says

      October 2, 2019 at 5:15 am

      Ignore me. I just got this working! :)

    • David Smith says

      October 2, 2019 at 7:07 am

      Glad to hear it, Daniel!

  4. Tanzil says

    March 11, 2019 at 8:46 am

    How we can give styling to gravity form review page. By default it shows label heading in one row and result in other row. i want to show both label heading and result in one row?

    Reply
    • David Smith says

      March 11, 2019 at 8:56 am

      You can take complete control of the All Fields merge tag with this: https://gravitywiz.com/gravity-forms-all-fields-template/

  5. Paul says

    March 7, 2019 at 1:31 am

    Love using Gravity Perks but find the help support hard to reach as my emails get intercepted by a robot. Once you do get though to David he is extremely helpful.

    Reply
    • David Smith says

      March 7, 2019 at 10:40 am

      Hi Paul, support is always available via our support form.

      http://gravitywiz.com/support

      As a small team, tickets arriving in a standardized format allows us to provide the most efficient support possible.

  6. Naomi says

    February 19, 2019 at 7:39 am

    This is an amazing little snippet, thanks so much! Only one small issue.

    Using {all_fields} in the last screen but the email field is always empty. In the confirmation email its populated. Any idea why?

    Reply
    • David Smith says

      February 19, 2019 at 8:39 am

      Strange. I’m not able to recreate this on my end. I’d recommend giving the plugin version a try. Alternately, you could try doing a theme/plugin conflict to see if a theme or plugin is conflicting with the snippet.

      https://docs.gravityforms.com/testing-for-a-themeplugin-conflict/

  7. Alistair Mckenzie says

    January 29, 2019 at 12:07 pm

    Hi on my review page (which looks great now thanks) the customer only wants certain sections i.e. the customers personal details to be shown I am using a paged form how do i go about doing this thanks in advance Alistair

    Reply
    • David Smith says

      January 30, 2019 at 3:46 am

      Hi Alistair, you can customize your preview by using the individual field merge tags rather than the {all_fields} merge tag. Alternately, you can customize the {all_fields} markup and exclude specific fields via the All Fields Template plugin.

    • Alistair Mckenzie says

      January 30, 2019 at 6:13 am

      Thanks David, I’am slowly getting there with the below, I presume I need to wrap in divs or spans so i can style manually but the main thing is how do i tell it if the field is empty don’t show

      Name: {Name:6.3}, {Name:6.6}, Date of Birth: {Date of Birth:7}, Sex: {Sex:5}, Marital Status: {Marital Status:8}, Email: {Email:10}, Telephone: {Telephone:11}, Address: {Address:37.1}, {Address:37.2}, {Address:37.3}, {Address:37.4}, {Address:37.5}

    • David Smith says

      January 30, 2019 at 8:46 am

      This will help: https://gravitywiz.com/gravity-forms-conditional-shortcode/

  8. Alistair Mckenzie says

    January 17, 2019 at 12:00 pm

    Works great but very ugly anyway of styling the Table as it seems pre-populated with style and don’t know were to change Thanks in advance

    Reply
    • David Smith says

      January 18, 2019 at 4:54 am

      Hi Alistair, this is the default way that Gravity Forms styles its {all_fields} merge tag. If you’d like to change this, we suggest our All Fields Template plugin: https://gravitywiz.com/gravity-forms-all-fields-template/

  9. Dillon Hergott says

    December 18, 2018 at 10:30 am

    I am using this addon for my submissions page, and it works great, but one small issue I have is when listing the merge tags in the HTML block in a list format, there are gaps where the merge tags that were not selected are.

    My temporary fix is placing each merge tag in its own HTML block, and setting the visibility conditions accordingly. But this is preventing me from placing a “Copy To Clipboard” button on the summary page

    Reply
    • David Smith says

      December 21, 2018 at 11:32 am

      Hi Dillon, I think the [gravityforms] conditional shortcode will help out here: https://gravitywiz.com/gravity-forms-conditional-shortcode/

  10. sudhamsu says

    July 19, 2018 at 4:59 am

    i have problem using the file upload with the multiple not displaying on the pre-submission,can you plz help me .

    Reply
    • David Smith says

      July 24, 2018 at 5:50 pm

      You’ll need to upgrade to Gravity Forms Preview Submission to get support for file uploads.

  11. dev says

    June 28, 2018 at 9:51 am

    Hi I cant get the files I submitted to display on the preview page. When i click the link to view file i get a page cannot be displayed error.

    Reply
    • David Smith says

      June 28, 2018 at 1:16 pm

      File uploads do not work with the snippet version. You’ll need the plugin version: https://gravitywiz.com/documentation/gravity-forms-preview-submission/

  12. Mark Root-Wiley says

    May 2, 2018 at 3:16 pm

    Thanks for this great snippet. As a heads up, it appears that it does not support multi-file uploads right now.

    Reply
    • David Smith says

      May 2, 2018 at 3:17 pm

      Hi Mark, this is supported in the perk-version. :)

    • Mark Root-Wiley says

      May 2, 2018 at 3:21 pm

      Touché! Thanks for letting me know.

  13. Tobi says

    April 26, 2018 at 10:39 pm

    Hi there, i’ve been using this for a long time, and it worked great!!

    but now it seems to be broken with gravity forms 2.3! (https://www.gravityforms.com/gravity-forms-v2-3-released/)

    –> the submit and back buttons don’t seem to work anymore, nothing happens when i click on them.

    do you experience the same problems with gravity 2.3? or should it be working? would be great if you can help.

    greetings from austria

    Reply
    • David Smith says

      April 26, 2018 at 11:12 pm

      I would not expect anything in 2.3 to conflict with this nor would I expect this snippet to impact page navigation. I’d recommend a theme/plugin conflict to confirm. https://docs.gravityforms.com/testing-for-a-themeplugin-conflict/

  14. David says

    February 13, 2018 at 6:45 pm

    Hello. I’m not sure of the correct terminology, but I’m trying this snippet and I’m experiencing a difficulty: When I use a field with a sub-value, the pre-submission confirmation shows the entire field. For example I’m trying this:

    “Hello, how’s the weather in {Address (City):4.3}?” Which should return the info from Address Field Value 4, sub-value 3 (City):

    “Hello, how’s the weather in Portland?

    But what I’m getting is this:

    “Hello, how’s the weather in 123 1st St, Portland, OR 97086, USA?”

    So it’s displaying the entire contents of the Address field. Any idea on how to fix this?

    Thanks.

    Reply
  15. Andreas says

    February 1, 2018 at 5:55 pm

    Hi I’m using your snippet to make a pretty pre-submission page. Everything works fine, but when using a “Option field” it won’t display value AND price in notification mail when the order has been submitted. Please take a look here: https://prnt.sc/gjoyk3 It does display the value and price on the pre-submission page but I would like to transfer these values to mail as well. Can you help me doing that? Thanks Andreas

    Reply
    • David Smith says

      February 2, 2018 at 9:23 pm

      We don’t have a simple solution for this but if you’re using the {all_fields} merge tag, you might consider our new plugin for customizing this: https://gravitywiz.com/gravity-forms-fields-template/

  16. kalle says

    November 21, 2017 at 10:56 pm

    Is there any way to hide fields with visibility set to hidden? like this code from gravity documentation?

    Reply
    • David Smith says

      November 22, 2017 at 12:12 pm

      This snippet definitely works with the plugin version of this code but I suspect it will also work with the snippet version.

      https://gist.github.com/spivurno/7bc96d50c1299a484166df0d06b96b48

« Older Comments

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Categories

  • How To (64)
  • News (21)
  • Plugins (14)
  • Releases (7)
  • Resource (3)
  • Snippets (58)
  • Tutorials (57)
  • Updates (104)

Recent Posts

  • How to Send a Follow-Up and Pre-Fill Information
  • How to Update Posts with Gravity Forms
  • Gravity Wiz Weekly #104
  • The Complete Guide to Using Gravity Forms With Zapier
  • Gravity Wiz Weekly #103

Meta

  • Log in
  • Entries feed
  • Comments feed
  • WordPress.org

Copyright © 2021 · Powered by WordPress · Gravity Wiz LLC

  • Support
  • Affiliates
  • About
  • Sitemap
  • Gravity Perks
    ▼
    • Gravity Perks
    • Tutorials & Snippets
    • About
  • Support
    ▼
    • Documentation
    • Support
    • Account