Summary/review/preview page before final submission in multistep forms

Marked #330937: Add a priview button as duplicate. Moving to 3.x queue. I didn't even see that there was an upload attached to this issue, though it almost certainly will require updating to work with the 3.x version.

Though this issue is a duplicate, I marked the earlier issue #308771: user preview of webform before submission, as duplicate since this one has a patch.

I've add "summary.inc" to webform/components, and it shows up in the admin page as a new component. I added it on the 3rd page of my form, as the only element, but it shows nothing.

What am I missing?

Great idea with that additional summary component type. Unfortunately I could not get it to work at all - the new component wouldn’t appear in my basic webforms settings, and also wouldn‘t appear in the selection of the component type when adding components to the form itself.

I’ve been using 3.0 beta 4.

Are there any plans to integrate this brilliant patch (if it would work!) to the official distribution of the module? I would appreciate that!

I'd like to include this patch in the official version of Webform, but it definitely needs to be updated to the 3.x version before it can be used. I don't think it will make it in before the 3.0 final version, but there's no reason it can't be added shortly afterward.

I have summary working in webform 3.x. It appears the component dropdown is now hard coded. The patch I have included modifies webform.module to include the summary.inc file.

Please bare with me, as this is my first contribution to the drupal community and patching in general.

It appears the component dropdown is now hard coded.

The list is now more flexible than it was before. Webform 3.x introduces hook_webform_component_info(), which allows 3rd-party modules to provided additional components. However since this is a patch to include summary functionality in Webform core, a patch to this list is definitely going to be necessary.

Rewrote most of the summary.inc provided above. This works for me on 3.x. Nested fieldsets are supported by text-indent.

Patch adds the summary element to the component list and ADDS the summary.inc file.

This patch might work but it won't be suitable for inclusion in Webform as-is. Rather than manually rebuilding all the display functions of Webform, we should re-use the existing rendering system of submissions that generates the form, e-mails, and submission viewing.

hey there, somehow the patch doesn't include labels of fields in the summary view? that makes it very weird,just to have a list of values.. could you add the title of each field in front or something please, that seems to be commented out now

cheers

PS. I see that using $component['name'] doesn't quite do the trick in there.. hmm.. would be great to have though

Your patch seems to be acting strange, trying against 3.4 tho...

webform$ cat ../summary_component.patch |patch -p1
patching file components/select.inc
Hunk #1 FAILED at 770.
1 out of 1 hunk FAILED -- saving rejects to file components/select.inc.rej
patching file components/summary.inc
patching file summary_component.patch
patching file webform.module
Hunk #1 succeeded at 728 (offset 12 lines).

tho the failed stuff is fairly trivial

webform$ cat components/select.inc.rej
--- home/jwineinger/Downloads/webform/components/select.inc	2010-08-16 10:39:39.000000000 -0500
+++ components/select.inc	2010-09-10 12:02:55.475229214 -0500
@@ -770,7 +770,13 @@
   // Execute the callback function.
   if (isset($info[$name]['options callback']) && function_exists($info[$name]['options callback'])) {
     $function = $info[$name]['options callback'];
-    return $function($component, $flat, $filter);
+
+    $options_args = array();
+    if (isset($info[$name]['options arguments'])) {
+      $options_args = $info[$name]['options arguments'];
+    }
+
+    return $function($component, $flat, $filter, $options_args);
   }
 }

Patch for 3.4 attached

hmm, did you just adjust the old version of the patch to apply to 3.4 correctly or did you actually edit something inside of it too, responding to http://drupal.org/node/435232#comment-3460202 ?

I applied that patch to 3.4 then cleaned up what didnt apply (because it looked like that was already in the code), then just done a git diff and made a new patch

great patch and would be a great inclusion in the module. for anyone using 3.2 Craigs patch #6 above worked for me.

dub

unfortunately, it still doesn't solve or reply to the issues outlined in http://drupal.org/node/435232#comment-3460202 which are preventing from getting it committed :(

Has anyone an idea how to achieve this with the D7-version?

Please answer here: http://drupal.org/node/974106

I applied the patch but no summary is displayed.
"The webform component summary is not able to be displayed".
Has anyone an idea?

Did not get the summary patch to work with D7!!!! and solved it with a modified template within my theme-folder.
A documentation on how to get the webform-values ist posted here: http://drupal.org/node/980566

Here an example for working with values of Webform 7.x-3.x-Dev (2010-Nov-18).

I copied the "webform-form.tpl.php" into my theme-folder and added the node-id of the specific webform-node: "webform-form-109.tpl.php".

Within the template you get the values like in these examples:
a) from a fieldset named "ottobrunner_konzerte":
$konzertkarten_normal = $_POST['submitted']['ottobrunner_konzerte']['konzertkarten_normal'];
$konzertkarten_ermaessigt = $_POST['submitted']['ottobrunner_konzerte']['konzertkarten_ermaessigt'];

b) from a "normal" field
$preis_ticket_normal = $_POST['submitted']['preis_ticket_normal'];
$preis_ticket_ermaessigt = $_POST['submitted']['preis_ticket_ermaessigt'];

ATTENTION: I am quite not sure if there´s a difference when adding ['value'] at the end.

Any suggestions from the pro´s ???

$konzertkarten_normal = $_POST['submitted']['ottobrunner_konzerte']['konzertkarten_normal'];

Just be sure not to introduce any XSS attacks there

Sorry - can you explain this for a non programmer like me.
Do you think it´s possible to pass values via get to the "$konzertkarten_normal"-variable?

If yes - how can I solve the problem.

http://api.drupal.org/api/drupal/modules--filter--filter.module/function...

I am new to drupal, please bare with me for anything obvious. I applied this webform-3.4-summary.patch but it dint result in options to preview the form. please help with your suggestions.

Subscribing.

Can anyone confirm if these patches work with 6.x-3.6? Which one should I use?

Can anyone tell me how to remove fields that are empty from the summary?

This is fairly essential and I am scratching my head.

Thanks.

This helped me from getting "The webform component summary is not able to be displayed" error:
placing both summary_component.patch and webform-3.4-summary.patch in the webform directory, then patching webform-3.4-summary.patch.
summary.inc will appear in the webform folder - move it to components folder and activate the module.

Unfortunately, selected grid options don't appear in the summary, date values neither.
Is there a way to get them to show up?

thx

subscribing

subscribing

Subscribing.

Subscribing.

What is remaining to make this patch ready for commit?

- Select grid
- Dates ?

@dgtlmoon So empty fields do not show?

Subscribing.

Hi Mate

Any idea how to hide fields that haven't been filled in?

The summary works perfect otherwise!!

Thanks

Hi everybody,
could someone please upload the patched version of the webform folder. I know how to patch, but in this case I'm trying to apply the patch on the 6.x-3.4 version for hours - without success.
Due to deadline pressure any help would be appreciated.

thanks in advance

Hi everybody,

Does anybody know, how to show the labels of the fields in the summary?
Is it possible to show multiple values from select list in the summary? And of course it would be great to hide fields that haven't been filled in.

Thanks

Hi,

Please, does anybody has an idea, how to show the lables of the field and show the multiple values from the select list in the summary.

Many thanks

After upgrading to Webform 3.9 the summary patch in #12 broke on me.

In the summary.inc file around line 119 I replaced:

$form_element['#value'] = _format_form_state(
    $form_state['storage']['submitted'],
    $select_mapping
  );

with:

$form_state_nam_val = array();
foreach($form_state['storage']['submitted'] as $key => $value) {
  $form_state_nam_val[$form_state['storage']['component_tree']['children'][$key]['form_key']] = $value;
}
  
$form_element['#value'] = _format_form_state(
  $form_state_nam_val,
  $select_mapping
);

The old code was getting the component number instead of the form_key. Works fine for me now.

Hi,

I am trying to get the summary-patch to work with drupal 7.
I am hanging on one last thing which I didnt get yet, maybe you could help me out:

As I understand this, in the webform function a subfunction named _set_summary is called.
In the set_summary function $form_element['#value'] has all the summarized data which is needed BUT
how could I access this data in the _webform_render_summary function? On the Summary-Site there is nothing displayed.

function _webform_render_summary($component) {

$form_item['results'] = array(
    '#type' => 'item',
    '#weight' => $component['weight'],
    '#prefix' => '<div class="webform-component-'. $component['type'] .'" id="webform-component-'. $component['form_key'] .'">',
    '#suffix' => '</div>',      
    '#title' => '',//$component['name'],
    '#value' => '',
    '#after_build' => array('_set_summary'),  //How could I get this return value to show up?? 
    );      
  return $form_item;
  
  
  
}

_set_summary

function _set_summary($form_element, &$form_state) {
  
  $select_mapping = array();
  _get_select_mappings(
    $form_state['webform']['component_tree']['children'],
    $select_mapping
  );



  $form_state_nam_val = array();
foreach($form_state['storage']['submitted'] as $key => $value) {
  $form_state_nam_val[$form_state['storage']['component_tree']['children'][$key]['form_key']] = $value;
}

 
$form_element['#value'] = _format_form_state(
  $form_state_nam_val,
  $select_mapping
);


  return $form_element;
}

Best Regards
Markus

Hi Markus,

i use this code and it works

/**
 * Implements _webform_theme_component().
 */
function _webform_theme_summary() {
  return array(
    'webform_display_summary' => array(
      'render element' => 'element',
    ),
  );
}

function _webform_render_summary($component, $filter = TRUE) {

 $form_item['results'] = array(
    '#type' => 'item',
    '#title' => $filter ? _webform_filter_xss($component['name']) : $component['name'],
    '#weight' => $component['weight'],
    '#prefix' => '<div class="webform-component-'. $component['type'] .'" id="webform-component-'. $component['form_key'] .'">',
    '#suffix' => '</div>',      
	'#theme' => 'webform_display_summary',
	'#theme_wrappers' => array('webform_element'),
    '#after_build' => array('_set_summary'),  //Set the value property by calling _set_summary 
    );      
  return $form_item;
}
/**
 * Implements _webform_display_component().
 */
function _webform_display_summary($component, $value, $format = 'html') {
  return array(
    '#title' => $component['name'],
    '#weight' => $component['weight'],
    '#theme' => 'webform_display_summary',
    '#theme_wrappers' => $format == 'html' ? array('webform_element') : array('webform_element_text'),
    '#format' => $format,
    '#value' => isset($value[0]) ? $value[0] : '',
    '#webform_component' => $component,
  );
}
/**
 * Format the output of data for this component.
 */
function theme_webform_display_summary($variables) {
  $element = $variables['element'];
  $element['#value'] = empty($element['#value']) ? ' ' : $element['#value'];
  return $element['#value'];
}

Hi guys, thanks for the updates. Once you get it working if you can reroll the patch and upload it that will help move this project forward.

Hey guys.

I've found patches awesome. I have ported it to D7 and totally reimplemented the way how rendering works, now it using code like this, a bit different, but more cool:

function _set_summary($form_element, &$form_state) {
  global $user;
  
  $submitted = $form_state['values']['submitted'];
  foreach ($submitted as $key => $value) {
    if (!is_numeric($key))
      unset($submitted[$key]);
  }
  
  $node = $form_state['build_info']['args'][0];
  foreach ($node->webform['components'] as $key => $component) {
    if ($component['type'] == 'pagebreak' || $component['type'] == 'summary') {
      unset($node->webform['components'][$key]);
    }
  }

  $submission = (object) array(
    'nid' => $node->nid,
    'uid' => $user->uid,
    'submitted' => REQUEST_TIME,
    'remote_addr' => ip_address(),
    'is_draft' => TRUE,
    'data' => webform_submission_data($node, $submitted),
  ); 
  $form_element['#markup'] = webform_submission_render($node, $submission, NULL, 'html');
  return $form_element;
}

Don't rush to commit this to the Webform module, cause it is already committed to the Webform Bonus Pack 7.x-3.x module, now I am back-porting this to D6. Issue is here http://drupal.org/node/1242914.

Now new Summary component available both for 6.x-3.x and 7.x-3.x versions of Webform Bonus module.

P.S.
Summary looks similar ways as in submission view.

Hi,

I have built a form using the form API and not using webform. Can this preview/summary function be re-used for a form built with Form API? Any idea if its already available?

Unfortunately no,

but you can configure nodes to show preview button before submission.

Will this feature be added to Webform core or remain only in Webform Bonus?

I would like to add it to Webform core. The Webform Bonus implementation works but I'd like to have it cleaned up a bit before being included in Webform directly.

@quicksketch, is there any time frame for the inclusion?

Great. Thx. I am going to sync 6.x to 7.x to make sure there are all new features in 7.x.

+1

Is this something that is in the works? It would be a huge help.

Is this something that is in the works? It would be a huge help.

I would like to add something like this officially to the project, but we haven't had a patch version of this feature since #12. I'm still not entirely sure which approach is best: a summary component (like Webform Bonus provides) or a review/confirmation page as an option. If people have insight as to how they would like it to work, please provide a narrative of you would expect to add and configure such an option from the perspective of a site editor or administrator.

It seems like it would work well to have a tickbox option "Present user with a review page before submission" on the advanced settings page (perhaps under "Status of this form").

The review page, which would be a page inserted at the end of the form, would then be a simple rendering of the previously entered values -- looking much (or exactly) like when the user chooses to view his/her own submission. This last page, which is only editable by going back to parts of the form using the Previous and Next buttons, would house the "Submit" button.

Do others think that might be a good way to go about it? I'm afraid that when digging through the code I've had trouble wrapping my head around bits of the webform architecture, so my suggestion may not take into account certain programming considerations.

You're the man Nate.

- Walter

PS Sorry for the delayed response

quicksketch, any way to sponsor this feature?

Hi @woop_light! I sent you an e-mail last week about sponsoring after you contacted me. I'll re-send it.

I've been working on implementing this feature. Per #53/54, this will probably be implemented as a form setting rather than as a component. This reduces conflicts with Form Builder, though it may be a slightly less flexible system (not allowing other components on the same page).

Here's the in-progress patch on this front, adding new settings to the Webform configuration for the preview option. This isn't fully working yet, as the main preview itself doesn't actually work yet. But the options are all there, save properly, and the form adds a page for the preview itself. This isn't ready for testing quite yet, just a status-update on this issue.

Here's how it looks in the UI. There are more options than I originally anticipated, considering we need to provide labels for the preview page and buttons. I'm a little worried this might be too overwhelming, but all settings are actually optional. Thoughts?

@quicksketch -- Looks great -- the controls make perfect sense to me. Can't wait to see it in action!

This version is ready for testing. It requires a new update hook to add the new database columns, so be sure to run update.php after patching. You should also make a database backup before upgrading in case you need to roll back the change.

Overall, I really like this functionality. Combined with the new progress bar, this really makes Webform feel like a complete package for complicated multi-page forms.

Minor documentation tweaks.

Committed to the 7.x-4.x branch. Moving this to be ported for the 8.x-4.x branch.

@quicksketch - can please push latest 7.x-4.x-dev branch to d.o. so this this can be simply downloaded within the whole package?

Committed to 8.x-4.x in 336e2a4. Thanks!

@pawel.traczynski this is already part of 7.x-4.x-dev as it was committed in d0a1fc5.

@quicksketch Something is wrong.

When I used version 7.4-dev I got error like in here: https://drupal.org/node/2119193
So I downloaded 7.4-beta1 and used your latest patch file I got same error. But when I used this patch #58 node and fields are added properly.

And after I added node got error: Notice: Array to string conversion in drupal_write_record() (line 7129 of /includes/common.inc).

Why preview page is not in theme system and I can't theme it? :(
Why confirmation message is in warning alert? :(

all this functionality is written not in drupal way :(
I think next version of preview page have to be writen with tokens. Like https://drupal.org/project/webform2pdf There you can customize pdf file and all fields are tokens and I can create whatever I want and just paste my token. Simple and nice to use.

Yes, i agree with Jarek. The way this summary functionality is done is totally not in-accordance with Drupal way of doing things.

And why hardcode warning message? What user will like it?? :D

Cheers Jarek ;)

I found that $preview_message don't use submission tokens because you used $submission. I changed it to: $preview_submission.

Why preview page is not in theme system and I can't theme it? :(

The preview page is explicitly part of the webform-form.tpl.php file, already broken-out and printed separately specifically so it's easy to change.

  // Print out the preview message if on the preview page.
  if (isset($form['preview_message'])) {
    print '<div class="messages warning">';
    print drupal_render($form['preview_message']);
    print '</div>';
  }

Is that not adequate?

Why confirmation message is in warning alert? :(

Because the default message is exactly that: a warning that the submission isn't completed yet and you need to click the submit button. If you would prefer it wasn't a warning, then you can change the webform-form.tpl.php file (as shown in the code above).

I think next version of preview page have to be writen with tokens.

The preview page does support tokens, but like you pointed out, this is more an accident than a failure in the architectural approach.

Ok. Now I understand that ;-) But first I was little confused. UI of creating a multistep form is complicated. For example title of first page you can change on form settings, but second page is title of page break, and in confirm page on fields summary you can see only a title of 2 title and higher. At first it was hard to understand some things. Now I founded webform-tpl.php and removed warning and after fixed some little bug I was able to make a confirm page as I wanted ;-)

But please look at: https://drupal.org/node/2119193 because there is critical bug on actual version. You can't save webform and grahamC created a patch fot this.

Thanks @jaroslaw.kaminski for the helpful patch. I've pushed these changes into the 4.x branch and it'll be in the new release tomorrow.

Needs porting to 8.x-4.x.

Committed 0e1e18d to 8.x-4.x.

The preview page is awesome! Thanks quicksketch!

Is there a way to style the preview page like a template file I can edit?

Thank you