Hi Jacob,
Firstly, thank for you for a great module. We use it quite extensively on a client project. We have quite complex flow with wizard pages and conditional logic, and this module works flawlessly.

With our user base we have done some testing and found that a wide majority of them tend to click the browser back button when they are on a form with many wizard pages. Initially we had disabled the browser back button, but this was confusing the users.

So, in the spirit of giving back, we extended the functionality of webform to provide additional form behaviour. Where, clicking the back button in the browser will actually click the "Previous Page" button provided by the page wizard.

Here is how it looks in webform settings page.

browser back

Keen to hear your thoughts on incorporating this functionality into webform.

CommentFileSizeAuthor
#22 option2.patch628 bytesmattgill
#22 option1.patch359 bytesmattgill
#17 2920443-17.patch158.66 KBjrockowitz
#17 interdiff-2920443-15-17.txt110.34 KBjrockowitz
#15 interdiff-2920443-1-15.txt14.31 KBjrockowitz
#15 2920443-15.patch15.21 KBjrockowitz
#10 2920443-1.patch10 KBdakku
#2 2920443.patch6.43 KBdakku
Screen Shot 2017-11-02 at 10.10.20 am.png68.83 KBdakku
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

dakku created an issue. See original summary.

dakku’s picture

dakku CreditAttribution: dakku commented
FileSize
2920443.patch6.43 KB
dakku’s picture

dakku CreditAttribution: dakku commented

Under the hood of all webform wrapper settings etc, this is what the core of the patch actually implements:

  if (window.history && window.history.pushState) {
    window.history.pushState('', null, '');
    window.onpopstate = function (event) {
     document.getElementById("edit-wizard-prev").click();
    };
  }

Status: Needs review » Needs work

The last submitted patch, 2: 2920443.patch, failed testing. View results
- codesniffer_fixes.patch Interdiff of automated coding standards fixes only.

dakku’s picture

dakku CreditAttribution: dakku commented

interestingly the coding standards that seem to have failed the tests are not related to this patch. So, ignoring the failure for now.

dakku’s picture

dakku CreditAttribution: dakku commented
Status: Needs work » Needs review
jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented

This is a good idea and very clean patch.

One immediate thing that should done is to create a test form that can be used for manual testing.(webform/tests/modules/webform_test/config/install/webform.webform.test_form_wizard_back_submit.yml)

Naming things is hard.

.

I think we should change 'form_browser_back' to be named 'form_submit_back' which contains the two keywords of this feature, "Browser Back Button to submit to previous wizard page"

Maybe the label should be changed "Browser back button submit" to "Submit form when browser back button is clicked"

dakku’s picture

dakku CreditAttribution: dakku commented

Hi Jacob,
Thanks for the feedback, Naming thing is indeed hard :)
I will incorporate your feedback and re-roll a new patch in the next day or so.

jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented
Assigned: Unassigned » jrockowitz

@dakku Absolutely no rush. I am reassigning this ticket to you.

Once, you have the test form setup. we can do some cross-browser testing.

dakku’s picture

dakku CreditAttribution: dakku commented
FileSize
2920443-1.patch10 KB

Hi Jacob,
Can we try this one?
it incorporates:

  • - the name space changes
  • - revised description for better grammar
  • - manual test mockup

Status: Needs review » Needs work

The last submitted patch, 10: 2920443-1.patch, failed testing. View results
- codesniffer_fixes.patch Interdiff of automated coding standards fixes only.

dakku’s picture

dakku CreditAttribution: dakku commented
Status: Needs work » Needs review

seem to have failed the tests are not related to this patch. So, ignoring the failure for now.

  • jrockowitz committed 4a5d929 on 2920443-browser-back-submit 
    Issue #2920443: Browser Back Button to submit to previous wizard page

  • jrockowitz committed a99d4d5 on 2920443-browser-back-submit 
    Issue #2920443: Browser Back Button to submit to previous wizard page
jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented
FileSize
2920443-15.patch15.21 KB
interdiff-2920443-1-15.txt14.31 KB

Looks pretty good.

Basically, I tweaked the patch to also fix the preview page's back and adjust the help text.

Once all the tests pass, I will generate the final patch that adds the 'form_submit_back' setting to all exported webforms.

  • jrockowitz committed 11859b9 on 2920443-browser-back-submit 
    Issue #2920443: Browser Back Button to submit to previous wizard page
  • jrockowitz committed 822a39e on 2920443-browser-back-submit
    Issue #2920443: Browser Back Button to submit to previous wizard page.
jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented
FileSize
interdiff-2920443-15-17.txt110.34 KB
2920443-17.patch158.66 KB
jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented
Status: Needs review » Fixed

  • jrockowitz committed cafb157 on 8.x-5.x authored by dakku 
    Issue #2920443 by jrockowitz, dakku: Browser Back Button to submit to...
dakku’s picture

dakku CreditAttribution: dakku commented

Hi Jacob,
Thank you for getting this one committed.
I will create a new patch should we find any cross browser issues. For now, all looks good.

dakku’s picture

dakku CreditAttribution: dakku commented

Hi Jacob,
Just noticed that the latest patch https://www.drupal.org/files/issues/2920443-17.patch is now using jQuery, but its missing the library dependencies to include jQuery.

Non JQuery

+(function () {
+
+  'use strict';
+
+  // From: https://stackoverflow.com/a/39019647
+  if (window.history && window.history.pushState) {
+    window.history.pushState('', null, '');
+    window.onpopstate = function (event) {
+     document.getElementById("edit-wizard-prev").click();
+    };
+  }
+
+})();

vs

jQuery

+(function ($) {
+
+  'use strict';
+
+  // From: https://stackoverflow.com/a/39019647
+  if (window.history && window.history.pushState) {
+    window.history.pushState('', null, '');
+    window.onpopstate = function (event) {
+     $('#edit-wizard-prev, #edit-preview-prev').click();
+    };
+  }
+
+})(jQuery);

is there is need for us to use jQuery?

I think we can either:
- revert to using non jQuery method like in the original patch here https://www.drupal.org/files/issues/2920443-1.patch
or
- update the library dependencies to include jQuery

Which would be your preference? :)

mattgill’s picture

mattgill CreditAttribution: mattgill as a volunteer commented
FileSize
option1.patch359 bytes
option2.patch628 bytes

I'm adding two patches which may help!

Option1.patch - adds the jquery dependency to the libraries yml
Option2.patch - converts the code from jquery to pure js

dakku’s picture

dakku CreditAttribution: dakku commented
Status: Fixed » Needs review
jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented

The webform module requires jQuery so I think we should "update the library dependencies to include jQuery".

dakku’s picture

dakku CreditAttribution: dakku commented

Thanks Jacob, in that case, please see Option1 patch above, courtesy of Matt :)

  • jrockowitz committed d2e1f6a on 8.x-5.x authored by mattgill 
    Issue #2920443 by jrockowitz, dakku, mattgill: Browser Back Button to...
jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented
Status: Needs review » Fixed

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.