Friday, April 5, 2013

Redirect after SharePoint form submission

In this article I will demonstrate how to handle a form submission event with Forms Designer tool and particularly how to redirect the user to the specific page.

Many of our clients request an option to redirect the user to the 'Thank you' page after creating a new item. Just paste the following script into the Forms Designer JavaScript editor and your users will be redirected to '/SitePages/ThankYou.aspx' page on the submission and to '/SitePages/Cancel.aspx' on the cancellation:

fd.cancel().click(function(){ STSNavigate('/SitePages/Cancel.aspx');return false; });
fd.onsubmit(function (){
    $("#aspnetForm").attr('action',location.pathname+'?Source=/SitePages/ThankYou.aspx');
    return true;
});

Ok, another popular request is to allow users to add multiple items without closing a new form. We suggest to confirm with the user whether they want to add a new item after the submission of the current one. If they want so, the new form will be refreshed. Otherwise the user will be redirected to the 'Thank you' page. I have extended the previous script with the described functionality:

fd.cancel().click(function(){ STSNavigate('/SitePages/Cancel.aspx');return false; });
fd.onsubmit(function (){
  if (confirm('Would you like to add a next item?')) {
    $("#aspnetForm").attr('action',location.pathname+'?Source=' + location.pathname);
  } else {
    $("#aspnetForm").attr('action',location.pathname+'?Source=/SitePages/ThankYou.aspx');
  }
  return true;
});

As you can see it is very easy to extend functionality of your form with Forms Designer JavaScript framework. You can find the full description of fd-object on the official website.

7 comments:

  1. thanks for the post.
    it look like the script is ignoring validation controls.

    ReplyDelete
    Replies
    1. Hello Liraz
      I have just tested this code with required fields and it seems it works correctly. Yes, the confirmation dialog will be shown before the current item is saved, but users will not be redirected until there are some validation issues in the form.

      Delete
  2. I would like a JS button inside my edit form which saves current form data without closing it. How would you solve this?

    ReplyDelete
  3. Hello - I've attempted to use this for page redirect after a form submission, but they appear not to work. After submitting the form in SharePoint 2010 I want to redirect to "/Site Pages/My Issues.aspx", so I have

    $("#aspnetForm").attr('action',location.pathname+'?Source=/SitePages/My Issues.aspx');

    within the onsubmit function. But it does not redirect to the above-mentioned page - it remains on the default view for the list. What else do I need to know? thanks

    ReplyDelete
    Replies
    1. Hmm, it works properly for me. Here is my code:
      fd.onsubmit(function() {
      $("#aspnetForm").attr('action',location.pathname+
      '?Source=/SitePages/How To Use This Library.aspx');
      return true;
      });

      Please, make sure there are no JS-errors in the browser console.

      Delete
    2. Hello - I've got the redirect working now, somewhat. I have the right page showing, except it's embedded in the widget window and not the main (parent) window. Am I able to load the page on the main window? thanks

      Delete