Digitalizing User Interactions with Forms

Objectives
After completing this lesson, you will be able to:

After completing this lesson, you will be able to:

  • Add interactive forms in the process you are building
  • Define different forms for triggers, approvals, and notifications

Digitalize User Interactions with Forms

You have probably experienced that many tasks in your working world, such as reviews, approvals, and validations are still assigned to employees via paper or e-mails. These tasks are a vital part of any business process but they are inefficient and slow.

Forms are a popular way to streamline these activities. Once you have created a form, you can use it to trigger a process to start or add an approval step in the process.

Let’s have a look at the trigger form. The trigger form is the starting point of your business process.

You can define two different types of triggers:

  • Using a form as a process trigger gives you an opportunity to use a direct link to the published form to start. Alternatively, you can embed the starting trigger into a tile in SAP Launchpad Service with the given parameters:
  • Using an API call as a process trigger, you can start your business process via API call. To do this, you have to define the required input parameters and reuse them as, for example, input fields:

After you have defined your trigger form, it is time to add approval forms to your business process via drag and drop functionality in the forms builder tool. Approval forms are intended to capture and share information. With that, you can simplify and accelerate business approval processes used by business users. Approval forms automatically provide the choice to approve or reject the request with the according notification.

You have different options to configure the approval forms and to add further information:

  • Make use of layouts such as headlines, and input fields such as text, dropdown, checkbox, number, date, choice, file upload/attachment*, and more.
  • Configure read-only or required fields and their format:
  • Define some more details like general information, inputs, and outputs:

Create a Form to Trigger a Business Process

Business Scenario

The first step in the development of your business process is the creation of a trigger form that will be the starting point of the business process. For that, you have to use the process builder tool.

To learn more about how to create a form to trigger a business process, follow this interactive tutorial.

Task flow

In this exercise, you will perform the following steps:

  • Design the form with the available layout.
  • Add further objects to the trigger form.
  • Use the trigger form for internal configurations.

To learn more about how to create a form to trigger a business process, follow this interactive tutorial.

Exercise options

To carry out this exercise, you can choose from the following options:

  1. Live Environment – by using the instructions provided below, you can perform the steps in your SAP BTP account.
  2. Platform Simulation – follow the step-by-step instructions within the simulation.
  3. Side-by-side: Follow the step-by-step instructions within the simulation and perform the steps in your SAP BTP account simultaneously.
Note
We strongly recommend to perform the steps in the live environment.

Result

You have successfully created a form to trigger a business process.

This concludes the interactive tutorial.

Task 1: Create a Form to Trigger a Business Process

Steps

  1. Create a trigger form.

    Use the following data:

    FieldValue
    NameOrder Processing Form
    IdentifierorderProcessingForm (filled automatically)
    DescriptionForm to collect order details

    1. Open the editor (or double click on the form).

    2. Choose Add.

    3. Choose FormsNew Form.

    4. In the Name field, enter Order Processing Form.

    5. The Identifier field, is populated automatically, when saved.

    6. In the Description field, enter Form to collect order details.

    7. Choose Create.

    8. You can now see that the form has been added as the Start Trigger.

  2. Add the first objects to the trigger form.

    Use the following data:

    FieldValue
    HeadlineOrder Approval Request Form
    ParagraphPlease provide the necessary information of your order and submit for approvals
    TextCustomer Name
    Requiredcheck the box

    1. Choose More.

    2. Choose Open Editor.

    3. Drag and drop the Headline 1 on the Order Processing Form.

    4. Drag and drop the Paragraph on the Order Processing Form.

    5. In the Headline field, enter Order Approval Request Form.

    6. In the Paragraph field, enter Please provide the necessary information of your order and submit for approvals.

    7. To create a field setting, drag and drop the Text on the Order Processing Form.

    8. In the Text field, enter Customer Name.

    9. Choose Required.

  3. Add further details to the form.

    Use the following data:

    CategoryElementTitleSettings
    InputsTextOrder NumberRequired
    InputsNumberOrder AmountRequired
    InputsDateOrder DateRequired
    InputsTextShipping CountryRequired
    InputsDateExpected Delivery DateRequired

    1. Add the mentioned objects, as described above.

    2. Choose Save.

    3. This is the result:

Result

You have successfully created a form to trigger a business process.

This concludes the interactive tutorial.

Create and Configure an Approval Form

Business Scenario

In this exercise, you are going to create and configure an approval form. Approval forms are being used to simplify and accelerate business approval processes used by business users.

Approval forms can include not only approvals, but also rejections, in the context of sales order processing, invoices, or employee onboarding. You can model these approval forms with the form builder that is imbedded in the process builder tool. These forms will be converted later on into tasks, as part of an automated workflow that will appear in the inbox of the authorized business users.

Exercise Options

To carry out this exercise, you can choose from the following options:

  1. Live Environment: Using the instructions provided below, you can perform the steps in your SAP BTP account.
  2. Platform Simulation: Follow the step-by-step instructions within the simulation.
  3. Side-by-side: Follow the step-by-step instructions within the simulation and perform the steps in your SAP BTP account simultaneously.
Note
We strongly recommend performing the steps in the live environment.

Task 1: Design the Approval Form

Steps

  1. Create an approval form.

    Use the following data:

    FieldValue
    NameApproval Form
    DescriptionForm to approve or reject the sales order

    1. Choose the Order Processing tab.

    2. Choose Add.

    3. Choose ApprovalsNew Approval Form.

    4. In the Name field, enter Approval Form.

    5. In the Description field, enter Form to approve or reject the sales order.

    6. Choose Create.

  2. Add the first objects to the approval form.

    Use the following data:

    FieldValue
    HeadlineApprove Sales Order
    ParagraphA new order has been received. Please review and confirm whether the requirements can be met or not
    ParagraphSales Order Details
    Text InputCustomer Name
    Property of this labelRead only

    1. Choose More.

    2. Choose Open Editor.

    3. Drag and drop the Headline 1 on the Order approval form.

    4. In the Headline field, enter Approve Sales Order.

    5. Drag and drop the Paragraph on the Approval Form.

    6. In the Paragraph field, enter A new order has been received. Please review and confirm whether the requirements can be met or not.

    7. Drag and drop a Paragraph on the Approval Form.

    8. In the Paragraph field, enter Sales Order Details:.

    9. Drag and drop a Text on the Approval Form.

    10. In the Label field, enter Customer Name.

    11. Choose Read Only.

    12. This is the result:

  3. Add further details to the form.

    Use the following data:

    CategoryElementTitleSettings
    InputsTextOrder NumberRead Only
    InputsNumberOrder AmountRead Only
    InputsDateOrder Delivery DateRead Only

    1. Add the mentioned objects, as described above.

  4. Add further fields.

    Use the following data:

    ElementTitle
    ParagraphSupplier Acknowledgment
    CheckboxI acknowledge that we have received your order and will process it based on the availability
    Text areaMessage to buyer

    1. Add the mentioned objects, as described in the steps above.

    2. Drag and drop a Paragraph on the approval form.

    3. In the Paragraph field, enter Supplier Acknowledgment.

    4. Drag and drop a Checkbox on the approval form.

    5. In the Label field, enter I acknowledge that we have received your order and will process it based on the availability.

    6. Drag and drop a Text Area on the approval form.

    7. In the Text field, enter Message to buyer:.

    8. Choose Save.

    9. This is the result.

Task 2: Configure an Approval Step

Steps

  1. Configure an approval step.

    In the following steps, you will configure an approval step in the process using the previously created approval form.

    Use the following data:

    FieldValue
    SubjectReview and approve order
    Subjectfrom
    Subjectcompany
    UsersProcess Started By
    This task is due2
    1. Choose the Order Processing tab.

    2. Choose Approval Form.

    3. In the Subject field, enter Review and approve order.

    4. Choose Subject.

    5. Choose Order Number.

    6. In the Subject field, enter from.

    7. Choose the Subject field again.

    8. Choose Customer Name.

    9. In the Subject field, enter company.

    10. Choose Users.

    11. Choose Process Started By.

    12. Open the Type Due Date list.

    13. Choose Static Duration.

    14. In the This task is due field, enter 2.

    15. Choose Inputs.

    16. Choose Customer Name.

    17. Choose Customer Name.

    18. Choose Order Delivery Date.

    19. Choose Expected Delivery Date.

    20. Choose Order Amount.

    21. Choose Order Amount.

    22. Choose Order Number.

    23. Choose Order Number.

    24. Choose Save.

    25. Result with an error.

      Note
      The process builder displays an error for the Approval step. This is because the Reject exit is not yet connected to any other step or end element.
    26. Result:

Result

You have successfully created and configured an approval form.

This concludes the tutorial.

Create and Configure a Form for Notifications

Business Scenario

Notifications are created after the user approves or rejects the request. These notifications will inform the requester whether their sales order is approved or rejected, and will be sent either via an email or through the form. They will appear in the inbox of the requester as a task.

After you have created your approval form, you want to make sure that the business user gets notified whether the request for example, sales order, has been approved or rejected.

To do this, you need to create and configure forms for notifications.

To learn more about how to create and configure forms for notifications, follow this tutorial.

Exercise Options

To carry out this exercise, you can choose from the following options:

  1. Live Environment: Using the instructions provided below, you can perform the steps in your SAP BTP account.
  2. Platform Simulation: Follow the step-by-step instructions within the simulation.
  3. Side-by-side: Follow the step-by-step instructions within the simulation and perform the steps in your SAP BTP account simultaneously.
Note
We strongly recommend to perform the steps in the live environment.

Result

You have successfully created and configured forms for notifications.

This concludes the tutorial.

Task 1: Create and Configure a Form for Notifications

Steps

  1. Create a new form.

    Use the following data:

    FieldValue
    NameOrder Confirmation Form
    IdentifierorderConfirmationForm (auto-filled)
    DescriptionNotification form to inform whether the sales order is approved by the supplier

    1. Choose Add.

    2. Choose FormsNew Form.

    3. In the Name field, enter Order Confirmation Form.

    4. In the Identifier field, you do not have to enter anything. The field is filled automatically.

    5. In the Description field, enter Notification form to inform whether the sales order is approved by the supplier.

    6. Choose Create.

  2. Edit the new form.

    Use the following data:

    TypeFieldValue/Configuration
    HeadlineHeadlineOrder Confirmation
    ParagraphParagraphorderConfirmationForm
    DescriptionDescriptionYour order has been received and accepted for delivery. We will send you the details as soon as the order is shipped. You can find the details of your order below, please review and verify your request:
    Text AreaTextMessage from the supplier:
    ParagraphParagraphYour Sales Order Details:
    TextLabelOrder Number
    status ofOrder NumberRead Only
    NumberLabelOrder Amount
    status ofOrder AmountRead Only
    DateLabelExpected Delivery Date
    status ofExpected Delivery DateRead Only

    1. Choose More.

    2. Choose Open Editor.

    3. Drag Headline1 and drop it on the form.

    4. In the Headline field, enter Order Confirmation.

    5. Drag Paragraph and drop it on the form.

    6. In the Paragraph field, enter Your order has been received and accepted for delivery. We will send you the details as soon as the order is shipped. You can find the details of your order below, please review and verify your request:.

    7. Drag Text and drop it on the form.

    8. In the Label field, enter Message from the supplier:.

    9. Drag Paragraph and drop it on the form.

    10. In the Paragraph field, enter Your Sales Order Details:.

    11. Drag Text and drop it on the form.

    12. In the Text field, enter Order Number.

    13. Choose Read Only.

    14. Drag Number and drop it on the Order Confirmation Form.

    15. In the Label field, enter Order Amount.

    16. Choose Read Only.

    17. Drag Date and drop it on the form.

    18. In the Label field, enter Expected Delivery Date.

    19. Choose Read Only.

    20. Choose Save.

  3. Add further details.

    Use the following data:

    FieldValue
    SubjectYour Order
    Subjecthas been successfully received
    UsersProcess Started By

    1. Choose Order Processing.

    2. Choose Order Confirmation Form.

    3. In the Subject field, enter Your Order.

    4. Choose Subject.

    5. Choose Order Number.

    6. In the Subject field, enter has been successfully received.

    7. Choose Users.

    8. Choose Process Started By.

    9. Choose Inputs.

    10. Choose Order Number.

    11. Choose Order Number.

    12. Choose Message from the supplier.

    13. Choose Message to buyer:.

    14. Choose Expected Delivery Date.

    15. Choose Expected Delivery Date.

    16. Choose Order Amount.

    17. Choose Order Amount.

    18. The process content will highlight the entries with the same data type as the input field. For example, if the input field is of number type, then Process Content will show only number type entries.

    19. Choose Save.

  4. Create another form by duplicating the recently created one.

    Use the following data:

    FieldValue
    NameOrder Rejection Form
    IdentifierorderRejectionForm (auto-filled)
    HeadlineOrder Rejection
    ParagraphWe are sorry to inform you that your order cannot be accepted. Any inconvenience caused due to the refusal of the order is regretted. You can find the reason for the rejection and the details of your order below, please confirm the request:
    ParagraphPlease choose the SUBMIT button to acknowledge the order status.

    1. You can copy the same form to create another form to send a rejection notification to the requester. If copy is not available, create the form in the same way and modify the texts wherever relevant, as shown below.

    2. Choose Overview.

    3. Choose More.

    4. Choose Duplicate.

      Hint
      Duplicate feature is used to copy artifacts within the Business Process, whereas Copy feature is used to copy artifacts across the business processes.
    5. In the Name field, enter Order Rejection Form.

    6. In the Identifier field, you do not have to enter anything. it is auto-filled.

    7. Choose Duplicate.

    8. In the Headline field, enter Order Rejection.

    9. In the Paragraph field, enter We are sorry to inform you that your order cannot be accepted. Any inconvenience caused due to the refusal of the order is regretted. You can find the reason for the rejection and the details of your order below, please confirm the request:.

    10. To add an input field, choose the scroll bar to scroll down.

    11. Drag Paragraph and drop it on the Order Confirmation Form.

    12. In the Paragraph field, enter Please Choose the SUBMIT button to acknowledge the order status..

    13. Choose Save.

  5. Extend the rejection order form.

    Use the following data:

    FieldValue
    SubjectYour Order
    Subjectis rejected by the supplier
    PriorityHigh
    UsersProcess Started By
    InputsExpected Delivery Date

    1. Choose the Order Processing tab.

    2. Choose Approval Form.

    3. Choose Add.

    4. Choose FormsOrder Rejection Form.

    5. In the Subject field, enter Your Order.

    6. Choose Subject.

    7. Choose Order Number.

    8. In the Subject field, enter is rejected by the supplier.

    9. To choose a Priority, open the list.

    10. Choose High.

    11. Choose Users.

    12. Choose Process Started By.

    13. Choose Inputs.

    14. Choose Expected Delivery Date.

    15. Choose Expected Delivery Date.

    16. Choose Message from the supplier.

    17. Choose Message to buyer:.

    18. Choose Order Amount.

    19. Choose Order Amount.

    20. Choose Order Number.

    21. Choose Order Number.

    22. Drag Submit and drop it on End.

    23. Choose Save.

      With this, you have completed the process design of your business process. You have experienced building a process in a completely no-code environment and with no technical know-how. You used the process builder to create a one-step approval process with trigger form, approval form, and notification forms.

Result

You have successfully created and configured forms for notifications.

This concludes the tutorial.

Save progress to your learning plan by logging in or creating an account

Login or Register