...
This is an example of what the form would look like.
Figure 1
The only external factor that may be outside of the Joget platform's control would be the external integration with the CRM software. We will walkthrough a few scenarios on how best to design for this business use case with UI/UX kept in mind.
...
- We will start with designing the form itself. The form itself is quite simple, with just 3 fields and all of them made mandatroy.
Figure 2 - In the userview, we are making use of the Form Menu and link it to the form we have just designed.
Figure 3
Configure "Action to Perform After Form Saved" to redirect to a "HTML Page" to show form submitted message (e.g. Form submitted. Thank you!). - Do not forget to create a CRUD menu too so that we can browse through all the submissions easily using Generate CRUD.
Figure 4 - At this point in time, there's no integration yet with the external CRM.
...
- Form Validation - Joget would iterate through each and every form element and invoking the validator (if configured).
Figure 5
If all validations pass, then it will move to the next step, else, end user will be redirected back to the same form with validation errors displayed like what is shown in the screenshot below.
Figure 6 - Form Store - Since validations have passed, Joget will now proceed to the next step, form data will be passed to the store binder.
Figure 7
By default, the load/store binder is Workflow Form Binder where it will load and store form data into the table name declared in the form properties. In this case, the table name is "demo_request". - Since we are using Workflow Form Binder, this would also mean that we are saving the form data locally in Joget's database.
...
By using Post Form Submission Processing in Form, and "Method 1 JSON Call" earlier, this is the easiest and quickest method. This allows us to invoke any Process Tool & Post Form Submission Processing Plugin. JSON Tool is one such candidate.
Figure 9
- Upon form submission, form fields will be validated, with its form data stored, then, the "Post Form Submission Processing" will be triggered.
- Response time of form submission will now include complete execution of the JSON Tool.
- Imagine that the external JSON API takes longer than expected to respond, the end user will be kept waiting.
Depending on the feature of the API call, we would assume that it would return a response to indicate successful execution. For example:-
Code Block language js title Sample JSON Call Response { "success" : "true" }- By using this integration point, there's no way to redirect the user to other place/menu when error occurs.
...
To avoid the waiting time for JSON Tool to finish executing, we can place it under Multi Tools instead.
Figure 10
Set the "Run Mode" such that it would execute the process tool (JSON Tool) in a new thread.
...
We can try to throw an exception instead in the Bean Shell code that we are writing.
Figure 12
This approach suffers from the following issues:-
...