How to connect three UI via a portal if we want simultaneous UI one after the other based on some conditions.

Certified Associate Developer

Hi Experts,

I have one more question regarding the portals. I have three UIs, one is the initial form and the second is the verification UI wherein user will provide the verification code received via an email and if the entered code matches with the email code then we will show up the third UI to provide further details and then it will submit the form.
How can this be achieved from technical POV?

Any solutions/suggestions will be highly appreciated. Thank you!

  Discussion posts and replies are publicly visible

  • You can’t run a process model with 3 different UI configured on it. Only thing which you can do is, have one UI and conditionally show part of it when certain conditions are matched. But in your case you also want to send an email which I have not tried so not sure if it would be possible from portal. 

    To me your use case looks like to be of an authenticate site and not of a portal

  •  

    Please try this if feasible

    In the portal object, have 2 pages. One page for Initial data and the other page that combines the verification and data display part.

    In the initial form get needed data and upon submission, save the entered details in temp table. The temp table should also have a column to store the code to be verified with. Then send the email to the user with a reference id and the code (reference id can be primary key from the temp table). You can also include a link to the second page to navigate from the email.

    With the reference id and code from email, user can come to the second page of the portal and validate themselves. If it is a legit user we can display the data.

  • This is achievable with a single UI, though not in the way you'd do it for an authenticated app. In an authenticated app, you'd model this as chained task forms in a process model.

    In a portal, you need to do this with progressive display through a SAIL UI:

    Step 1: show the initial form. On completion of the form, clicking Next both runs a!startProcess and moves the UI to Step 2. The process that's started accepts the user data, generates a verification code, writes it along with the data and emails it to the email address provided in the form.

    Step 2: accepts a verification code and does a lookup on the back end, if it's not a valid code show an error message, otherwise move to Step 3.

    Step 3: show the retrieved data from Step 1, as well as the remaining form fields. The user fills out the rest of the form and clicking Submit runs a second a!startProcess (for a different process model) that does the final submission.

    ~~~~~

    Because this is all in the same Portal page, if the user refreshes they'll lose progress through the wizard, so in Step 1 you'll also need to put a control in the UI somewhere that says "I already have a code" so the user can get to Step 2 without submitting a new form.

    The other designs here also work if you prefer to have a UX with two separate pages because you prefer that user experience.

  • 0
    Certified Associate Developer
    in reply to John Rogers

    Thank you  for such a detailed answer. It worked for me!

  • 0
    Certified Associate Developer
    in reply to Kumar Agniwesh

    Thank you  for your answer.