Been working on a little but I would say valuable plugin for Tasklist: Simple, easy to use, straight to the point; Formio Integration!
This gives us Formio forms within tasklist (start forms and User Task Forms) without having to write new HTML. You can build your formio JSON and import the JSON file.
It provides multiple options and does not require any modifications to camunda modeler.
Features:
Configure the use of the formio form using regular Form Key syntax:
embedded:/forms/formio.html?deployment=MyUT1.json
Deploy .json (form schemas) through the regular deployment API along with your BPMN
Re-use forms by placing the JSON files in the file system / webapp folder of tasklist:
Pre-populate fields based on Process Variables / Task Variables: You can define and manipulate which variables to fetch (inlcuding JSON variables). See the Readme.
Submissions are saved as a json variable (including metadata about the browser that made the submission) See Readme.
This should give the community a MUCH NEEDED upgrade to the embedded angular forms which have really shown their age and hardships with lack of features over the years…
You can now set a validation constraint, and if you have the form-validation-server running it will validate. You can even define “server-side only” validations.
If you check out the latest code, I have added file upload/download support, as well as sub forms/nested forms.
Sub forms/nested forms enable you to quickly reuse forms such as: display a readOnly version of a start form in a user task, and populate the fields with the values from the start form submission.
Stephen, I am trying to deploy with spring boot using deployment option embedded:app:forms/formio.html?deployment=MyUT1.json,
I placed bpmn and json files next to each other in src/main/resources but the forms are not being rendered in the engine when I start a process instance. I tried with path parameter as well by placing json files in src/main/webapp, same issue, it doesn’t render in the engine. Your help is really appreciated on this.
Update made today to better support Tasklist bootstrap 3. Forms should be rendering very closely or the same as the rest of tasklist’s implementation of bootstrap3
Stephen, you are right, it works fine when I deployed all files through REST API and I used parameter as deployment= in the form key
I am trying to use file system option with spring boot app.
I changed all the formkeys in the modelto use path variable in the model
example: embedded:app:forms/formio.html?path=/forms/ChoicesEnumExample.json&var=choice
I kept .bpmn file under src/main/resources
I tried placing json files in src/main/webapp/forms and src/main/resouces/static/forms.
then, I am able to start the process but when I tried to load the user task for I see the JSON file not found an error on the browser. Really appreciate if you can help with the spring boot specific file structure
I just tested and it is working as expected. I updated the BPMN in the ./bpmn folder with a path example. You still require to deploy the BPMN through the rest api. But then there will be a user task:
“Typical Form with Server Validation (path loaded)” embedded:/forms/formio.html?path=/forms/MyUT1.json&var=subWithServerValidationPathLoaded
The plugin provides two types of variable security:
allowed-variables : a comma separated list of variable names that can be accessed using the endpoint GET /task/{id}/form-variables or the java api (getFormVariables).
restricted-variables : a comma separated list of variable names that cannot be accessed using the endpoint GET /task/{id}/form-variables or the java api (getFormVariables).
allowed-variables is used to control the exact list of variables that can be accessed. Any variables that are not part of this list will be removed from the result. No error will be thrown.
restricted-variables is used to control which variables cannot be accessed. Any variables that are part of this will be removed from the result. No error will be thrown.
Using this ensures that you can control variable access at runtime (assuming that you have locked down other endpoints on the Rest API and WebApps REST API, so only task/id/form-variables can be used.
To control variable modification it is assumed that you will use a Formio Form and the Formio server side validation.
If you try and request a variable using the formio pre-population feature and the variable is not returned from /form-variables, then an error notification will be provided in the task list UI.
@StephenOTT, love this plugin; adds so much usability to Camunda’s Tasklist UX that it may just be the thing I needed transition my company!
One issue I’m running into; I cannot seem to access the submitted variable (transient or not) via a start even execution listener (neither start nor end) unless the start-event is flagged as Asynchronous Before.
This might be fine, except ultimately I’m wanting to use transients variables and have my listener parse things out as appropriate. Of course, because of the seemingly async-before dependency, the transient data is no longer available
Have you experienced this at all? Any ideas where I’m going wrong?
Bug in 7.13 was certainly the culprit. Thanks for the heads up!
For my use case, I’ve moving 7.14 and have confirmed that this particular scenario appears to be resolved; but thanks for the heads up on a Script task workaround. I may be forced to leverage that before I get to Prod.
Thanks for all the hard work you do throughout the community here!
When you use the extension properties, you do not need to configure the formKey or form fields (for the server validation). All of that is taken care of!
Is there any interest in having the ability to store the Formio JSON in a extension property in the BPMN? This would mean you no longer have to upload multiple files (such as json files for each form).
