JotForm User Guide / Advanced Features /

A General Approach on Building an Approval Process Workflow

A General Approach on Building an Approval Process Workflow

UPDATE: You can now build an approval flow with JotForm Approvals! Without any coding, you can turn your online forms into custom automated approval flows. Just drag and drop to add approvers, emails, conditional branches, and more to your approval process.

Create an approval process in JotForm. Different companies/businesses will always have their own approval process. Surely, we can't cover all of them so this guide will be leaning more towards discussing general guidelines on how to come up with a workflow that fits your requirements.

First off, what's an approval process? You may already have one in place and want to incorporate it with your forms. In layman's terms, this process is just a way to have someone approve (or deny) a submission, entry, or registration.

With JotForm though, all submissions are treated equally and we don't have an innate way to approve or deny a submission. We'd like to showcase some key features and options we have that you can take advantage of, how to utilize them properly, and combine them in order to come up with an approval process on your own.

Here's a typical use case to give you an idea how it works:

  1. Customer submits a form.
  2. Manager A receives it via email and reviews the entry.
  3. Manager A confirms and approves it by editing the submission and re-submitting it.
  4. Manager B (or someone else) receives another email after Manager A's approval.
  5. Customer receives an email whether he's approved or denied.

With the scenario above, one key ingredient would be emails. Regardless of how long the approval process is (e.g. if 2 or more managers need to check and review the submission), it all boils down to notifying the intended recipient before or after a submission gets approved/denied.

So, in theory, these are all the features you need to make this work:

  • A hidden field - will serve as the approval status. Our recommendation is to use a drop-down menu. This will simplify the process by only allowing someone to pick from 2 different options - either Approved or Denied.
  • Email Notifications - will be used to send emails to managers, staff, or anyone needed in the approval process.
  • Autoresponders - will be used to send emails to your customers. You may create different Autoresponder templates for approved or denied customers.
  • Widgets - you need the Get Form Page URL Widget which will be used in conjunction with Conditions and a Signature Field as a part of the approval process if necessary.
  • Edit Submission Link or Edit Link - will be used with Conditions to trigger an action based on the URL where the form is being filled out.
  • Conditions - this will be the core of the entire workflow and there are plenty of reasons why we need conditions, all of which will be discussed later.

So, let's get started:

  1. Build your form or if you already have one, use that.
  2. Add a Dropdown field to your form.
    dropdown-form-element
    dropdown-form-element

    Set the Dropdown options as Approved / Denied.

    dropdown-properties
  3. Let's move on to emails. Set up your Notifications and Autoresponders upon your discretion. If you need different email templates when someone reviews a submission, approves it, denies it, etc, it's all up to you. These templates will then be used later on with your Conditions.

    One important feature that needs to be enabled on your Autoresponders is the Send on Edit option. Ensure that this is enabled so your customers will receive the Autoresponder upon editing their submission.

    send-on-edit
    send-on-edit
  4. Add the Edit Submission Link to the Notification template that would be sent to the person in charge of deciding the approval.
    submission-edit-link
    submission-edit-link
  5. It's time to add the widgets. If your approval process requires an e-signature from the boss or manager who approves the submission, then add your preferred Signature Field.
    smooth-signature-widget
    smooth-signature-widget

    Next, add the Get Form Page URL Widget.

    get-form-url-widget
  6. Lastly, set up your Conditions. Since this part highly depends on how you want the process to work, we'll lay down some possible scenarios and the needed Conditions to make them happen.
    1. To send the Autoresponder Template to the customer if he has been approved, add a Change E-Mail Recipient condition:
      change-email-recipient-approved

      Logic: IF Dropdown field IS EQUAL TO "Approved" then SEND Approved Email to respondent.

    2. To send the Autoresponder Template to the customer if he has been denied, add a Change E-Mail Recipient condition:

      Logic: IF Dropdown field IS EQUAL TO "Denied" then SEND Denied Email to respondent.

    3. To show the hidden Dropdown and Signature fields once the Manager views the entry through the Edit Submission Link, add a Show / Hide Field condition:
      conditional-logic-get-page-url

      Logic: IF Get Page URL CONTAINS the word "edit" then SHOW the Dropdown and Signature fields.

      This would also cause the Dropdown and Signature fields to be hidden by default, and will only be shown once the form is being viewed from the Edit Submission Link.

And that should be the bare minimum to make this work. Here's the completed form: https://www.jotform.com/70241540895961.

To show another variation, the demo form above has the following:

  • Three (3) Email Notification Templates: these are for the Initial Notification prior to editing, Approved Notification, and Denied Notification after editing the submission.
  • Two (2) Autoresponder Templates: one for an Approved Followup Email and another for a Denied Followup Email both of which triggered after editing the submission.
  • Four (4) Conditions: to show the hidden fields on edit, to send out the initial Notification on first submission, to send Approved Notification / Autoresponder, to send Denied Notification / Autoresponder.
get-page-url-change-email-recipient

Since this is a fairly advanced topic, it's recommended that you're familiar with how Conditions work. To better understand, we strongly suggest you clone the demo form.

Comments and suggestions are welcome below. If you have a question, post it in our Support Forum so we can assist you.

 

Contact Support:
Our customer support team is available 24/7 and our average response time is between one to two hours.
Our team can be contacted via:
Contact JotForm Support: https://www.jotform.com/contact/

Send Comment

29 Comments...

  • Mustapha_cms

    hi , may i know how to setup the second approval ? i know only set up if only one approval..how about the second approval? please assist.thanks

  • cole.zrostlik

    My question is similar to deanborst's, but it's the opposite.

    I'd like to enter some information on to the form and send it to a customer.
    Customer enters more information and signs
    Their submission triggers an email to send them two more forms (or a link to them).

    I thought the answer to deanborst's question would help me, but clicking on it gives me a 404 error.

  • ppintang

    I want to have the specific sections shown only to who should be filling them (teacher section is shown to the teacher, parent section shown to parent, and admin section shown to admin)

  • deanborst

    I am trying to use this to make my process.

    I would like

    Customer to fill out form and submit
    Me to fill our rest of form and sign.
    Send back to customer to review and sign.

    Is there an easy way to do this?

  • scott313

    Taking this approval one step further, can we integrate with a payment processor for those forms that are approved after been edited? e.g we are enrolling students into courses they have to pay for however some have outstanding fees from the previous course.

    So once enrolled our finance dept need to check if any O/F apply and adjust the tool cost and payment schedule. Then approve the form, this then needs to be sent back to the student to be signed and paid for through an integrated payment processor or API and payment provider??

    Is this currently possible.... formstack have approvals built-in but cannot trigger a payment processor after approval.

  • judith Browder

    I am trying to set up a form that must be signed electronically by a parent, teacher, and administrator. I have done all of the steps except setting up the conditions, which will need to go to different parents and teachers each time the form is filled out. I am the administrator, so that will be the same, can you let me know step by step how to create this in my jotform.
    Thank you

  • Ezmi Carrizales

    How can I collect multiple printed names along with their signatures to a PDF form that I already have uploaded onto a jotform?

  • lev.z

    Hi,

    I cloned the form. Submitted the answers. Redirected to Thank you page.
    But the are some issues:
    1. The submissions view is empty.
    2. I also didn't receive the NOTIFICATION WITH EDIT LINK

    Please assist.
    Lev

  • jasonck74

    I cloned the demo form as recommended and it does not work for me. It looks there is a condition on the signature that is no longer working or setup that could be causing the problem.

  • HuttonSafetyGroup

    Do you guys have any forms with a multi-level approval that I could test out?

    For instance if after Manager A approves, it goes to Manager B who also needs to approve/deny it before Manager C would receive the completed version?

  • Matthieu McClintock

    There's a native, easy to use integration for creating approval workflows around Jotforms

  • michael.laurent

    I make approval form.
    How to change notification email to the approval mail directly?

    I have field in the form where requester should put their supervisor's mail.
    Then when she/he click submit, the form should go to the that address.

  • cjadeltas1975

    How do you prevent the first approver from changing the document after the second approver submits. in other words how do you "lock" the form from further editing?

  • ctpartnerscn

    Very helpful.. Love it...!! And worked for my needs.!
    #FIVE STARS..!

  • timeoff.theramart

    So this wont work for basic plan because of notification limit?

  • TitanIND

    How do I get the form to alert the sender that the leave has been approved? I just keep getting the same response into my inbox that the form can be edited
    as far as I can see I have the receiver emails set up correctly

  • lafarge

    Is there a way to stop the form from submitting to a good sheet if the status is not set as approved?

  • Jeff

    This solution was suggested after my email support question. However, there may be a simpler way should I explain the process in more detail.

    I have a form that is used by Referee Coaches to provide feedback to referees. The Referee Coaches add their names and email addresses to the form so they receive a copy of the coach report via email. They also provide the names and email addresses of the referees so they also receive a copy of the coach report via email. As the Referee Development Manager, I receive a copy of all coach reports generated via email. I have one field in the JotForm called "Admin: Game/Referee Feedback". What I would like to achieve is to make this field hidden to the referees but visible to the Referee Coaches and myself once the form is submitted and sent via email. This field will allow the Referee Coaches to make statements about the referees/game that may be to direct or blunt for the referees to see, but would be helpful to the Referee Coach team in order to build a strategy for the referee's development. Is there a way of achieving this type of output without the approval process?

  • kaambhari

    I too have to make a similar project. Can i get the code of this approval/rejection system?

  • BrysonLawFirmLLC

    I've done this but am not receiving the original submissions that allow me to click the link through to edit (approve/deny). Any reason why the submission emails would not be received?

  • ITDirect

    I also have been trying to get a work flow like this working in a form. I submitted a ticket and was told to turn on "send on edit" option on my emails but I am not using auto responding emails - only notifications and turning that option on will send out multiple confusing emails to the users. I focused on the conditional logic of the email as being the issue but I cannot find the problem.

    https://form.jotform.com/83084558779172

    Thank you for any assistance,
    Lisa

  • Ketan_bhavsar

    We wish to create a Leave form Approval.
    Leave request submitted by Employee will be reviewed by respective supervisor.
    How can I accommodate this supervisor selection process, while employee submits leave form.

    eg.

    Emp A works in Sales Team >> sales manger will be Supervisor
    Emp B Wokrs in Logistic >> Logistic manger will be super visor
    Empl C works in Packing >> Packing manager will be Supervisor
    Emp D works in Finance >> Finanace maneger will be supervisor

    And CEO will approve leave requeuset of all supervisors.
    How to address this scenario

  • mvloft

    I was able to complete all the listed steps. but when the approver goes in and changes the status to approved or declined, it does not initiate the email notifications.

  • Matthieu McClintock

    Here is a new integration for free approval workflows for JotForm by ProcessMaker.

    https://apps.jotform.com/app/approval_workflow_by_processmaker

  • nrhspLaura

    This is also not working for me -- its not letting us edit the hidden field from submissions. Has anyone had any luck?

  • nshah1

    Can I make the form un-editable for the approver, such that the approver cannot edit anything that the requester entered.
    The only field that the approver can edit is the 'hidden' fields to requester i.e the 'Approval Status' and signature.

  • balogen

    Instead of the email having a link which sends the manager to then click approve or denied, is it possible for the email itself to have two links - approve and denied? That way the manager just needs to click once inside the email. i.e. the email says click APPROVE to approve or click DENIED to deny

  • sstaffordwtec

    Hello,

    I am having difficulties with the approval process flow. There are three steps to complete the purchase.
    1 - Requester send forms for approval.
    2 - Approver receives notification with the request, selects approved and submit the form to a purchaser.
    3 - Purchaser completes purchase and sends a receipt to requester.

    How would that work best. I tried everything I could and I still can get it to work.

    Thank You

  • CityofPalmSprings

    thank you this sounds great, will try in the next week or so.