Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Braydie 148 posts 346 karma points
    Aug 01, 2017 @ 10:36
    Braydie
    0

    Hitting enter on keyboard takes me to previous form page

    I've done some googling and not been able to find anyone with the same issue, but I've installed 6.0.2 of Forms into a 7.6.4 install of Umbraco and I've been able to create forms etc no problem.

    One thing I've noticed is that if I hit the 'enter' key to submit my form, it will go to the previous form step if I'm not on the first page.

    I had a feeling it was due to posting __prev and/or #PreviousClicked in the request payload so intercepted the form submit event and removed them before proceeding but that has made no difference.

    Anyone experienced the same behaviour, or is it just something I'm doing wrong..?

  • Mike Beale 32 posts 124 karma points
    Aug 01, 2017 @ 11:29
    Mike Beale
    1

    It's not just you! Can confirm the same behaviour with Umbraco 7.3.0 and Forms 4.4.2

  • Braydie 148 posts 346 karma points
    Aug 01, 2017 @ 12:14
    Braydie
    0

    It's a relief to know it's not just me!

  • Braydie 148 posts 346 karma points
    Aug 01, 2017 @ 13:17
    Braydie
    0

    So I've reflected Umbraco.Forms.Web.dll and found Umbraco.Forms.Web.Controllers.UmbracoFormsController in the HandleForm(...) method is responsible for deciding as part of the submission whether the form should go back a step, forward a step, or submit.

    There is an if statement that specifies that if __prev or PreviousClicked is in the request, then go back, otherwise go forward.

    The code looks like this:

    if (this.HoneyPotIsEmpty(model)) // Checks that the form id is in the request -- appears to be used to determine that a form should be submitted rather than go to prev/next page
          {
            model.FormState = this.ExtractCurrentPageState(model, this.ControllerContext, form);
            this.StoreFormState(model.FormState, model);
            if ((!string.IsNullOrEmpty(this.Request["__prev"]) || !string.IsNullOrEmpty(this.Request["PreviousClicked"])) && model.FormStep > 0)
            {
              this.GoBackward(form, model, model.FormState);
            }
            else
            {
              this.ValidateFormState(model, form, this.ControllerContext.HttpContext, captchaIsValid);
              if (this.ModelState.IsValid)
                this.GoForward(form, model, model.FormState);
            }
            model.IsFirstPage = model.FormStep == 0;
            model.IsLastPage = model.FormStep == form.Pages.Count - 1;
          }
          else
            model.SubmitHandled = true;
    

    I've tried to intercept the request to try and manipulate these values based on what is happening on the front-end but have had no luck so far....

  • Braydie 148 posts 346 karma points
    Aug 01, 2017 @ 14:53
    Braydie
    100

    So here is the solution that has worked for me. Not sure if my solution will work as is for your setup, but should steer you in the right direction.

    There appear to be two issues here:

    • The default markup for the previous button is of type 'submit', this will cause the click event to be fired for this when the form is submitted because it is the first input type=submit that can be found. This should be changed to be <input type="button" /> to prevent the click event firing whilst ensuring the value is passed to server correctly
    • If you do the above, then the previous button will stop posting the form so you will need to create a new click event handler on it to force the submission of the form "to go back". JQuery snippet below.
    • The #PreviousClick element value is not being set correctly when you press 'enter' to submit a form.

    .

    $(function () {
        var isPreviousClicked = false;
        $(".iomg-form").on("submit", function (e) {
            e.preventDefault();
            if (isPreviousClicked) {
                $("#PreviousClicked").val("true");
            } else {
                $("#PreviousClicked").val(null);
            }
            this.submit();
        });
    
        $("input[name='__prev']").on("click", function (e) {
            isPreviousClicked = true;
            $(".iomg-form").trigger("submit");
         }); 
    });
    
  • Nurhak Kaya 40 posts 133 karma points
    Oct 07, 2020 @ 19:17
    Nurhak Kaya
    0

    Still an open bug but you can alternatively use this other workaround.

Please Sign in or register to post replies

Write your reply to:

Draft