In the blog Dynamic Forms Architecture and Design, we saw how rules driven dynamic forms can be architected with a model/view pattern, where the model is defined in a no-code rules development environment and the view can be implemented with any front-end framework. In this blog, we will dive into the main concepts to create a model. We will be using Corticon.js as the no-code development tool for the model.
As a modeler, your main responsibilities are to specify:
1. The flow of questions the user will go through (all the possible paths the questionnaire can take). The paths can be viewed as a decision tree, where each branch has its set of questions (of course there is a provision for reusing a set of steps that are common to multiple paths). This requires a deep understanding of the business problem at hand. As a modeler, you will need to work with stage numbers to implement the flow of questions (more on this topic below). The benefit here is that the model insulates the front-end developer of all flow decisions—in other words, the UI developer does not need to understand the specific problem domain or use case. This greatly simplifies the development of the UI, whether as a Web front-end or a mobile application.
2. For each UI step:
3. Where to store the accumulated data entered by the user or data computed at various steps. This will serve two purposes:
Incidentally, the fact that the model specifies the data fields for storing answers is a key property to ensure the view remains generic and can be reused across different forms; in other words, the view does not need to know and understand the data for each question, it just needs to use the name specified by the model to store the answer. This greatly simplifies the front-end form development.
The stage is a number that uniquely identifies what needs to happen at a specific step of the questionnaire. For example, at stage 2 ask for first name and last name, then at stage 3 ask for gender.
As a modeler and creator of the decision service you decide what stage numbers to assign to the various steps used in the overall questionnaire.
The set of stages the user goes through constitutes a flow. In typical dynamic forms, questionnaires need to go through various flows because the set of questions to ask varies based on answers to previous questions and based on external data (such as user profile data or time of day). For example, the questionnaire can go through stage 1, 2, 3, 4 and 10 if the user answers yes to the first question and through stage 1, 5, 6, 7, 8, 9 and 10 if the user answers no to the first question.
The flow can also be determined by the answers to various questions in the flow. Corticon can scale without issues for the most complex flows independently of the number of conditions to branch with.
We have seen customers implement complex dynamic forms with hundreds of different flows.
Now that we have seen what the main concepts are, we will take a look at how these concepts are applied within the Corticon studio modeling tool.
Note: the following section assumes you are already trained on Corticon.js studio. If you are not, you may want to check out this free online introductory tutorial.
The model is composed of a series of Corticon rulesheets and at least one ruleflow including all the rulesheets.
You specify these main items:
This is the simplest task, as you just need to drag all your rulesheets into the ruleflow canvas. In general, you do not need to connect rulesheets with each other as the order of execution does not matter. This is because the ruleflow will be executed for a specific stage; that is, the view will call the ruleflow (the decision service) specifying the current stage number to execute and as all rulesheets filter on stage number, only the ones that match the filter will execute.
However, there are times when you will need to specify the order of execution. This is will be the case when you implement a stage in multiple rulesheets.
For example, here we can see how step five is implemented in three rulesheets with an explicit execution order.
Corticon is a very versatile product; as such, there are multiple ways to approach and solve problems with it. We have developed one approach, a set of patterns and multiple samples. We have published them on the Corticon public GitHub repo here.
These should help you get started very quickly with complex rules based dynamic forms. Feel free to use the solution as is and adapt it to your own needs as you see fit.
Hopefully, this blog has provided you with enough context to understand the samples on the GitHub, but if not, do not hesitate to reach out.
To get started:
Let our experts teach you how to use Sitefinity's best-in-class features to deliver compelling digital experiences.Learn More
Subscribe to get all the news, info and tutorials you need to build better business apps and sites
You can also ask us not to share your Personal Information to third parties here: Do Not Sell or Share My Info
We see that you have already chosen to receive marketing materials from us. If you wish to change this at any time you may do so by clicking here.
Thank you for your continued interest in Progress. Based on either your previous activity on our websites or our ongoing relationship, we will keep you updated on our products, solutions, services, company news and events. If you decide that you want to be removed from our mailing lists at any time, you can change your contact preferences by clicking here.