How to show a list of database objects in the interface?

Hello,
my Name is Max.
First I’m really sorry for my bad english.

For a studentproject we have to translate a Bonita-BPM project to Camunda-BPM.

We work with an Oracle-database and jdbc.

Our Problem is this, we have to show the employee ,who is working with the task, our whole client base.
It’s no problem to get the data from our database ond to save it in a resultSet. But we really struggle after that step.
How can we import an array from our Java-class into Camunda an then further to the HTML-file?

Hi @Maximilian_Suckow,

you can save the result of the database request in a process variable to get it in camunda and to use it in a task form.
Do you use a service to get the data from the database? This service could you call from the java delegate.
Below, you can see a small abstract example.

public class GetDataDelegate implements JavaDelegate {
  @Override
  public void execute(DelegateExecution execution) throws Exception {
    DatabaseService databaseService = new DatabaseService();
    List dataList = databaseService.getData();
    execution.setVariable("data", dataList);
  }

When you have the process variable, you could access it in an user task form. For more details see https://docs.camunda.org/manual/7.7/user-guide/task-forms/

Cheers
kristin

Hi @kristin,

thank you for your advice.

Unfortunately, we have little experience with Camunda and, hence, process variables in general. It is not a big deal for us to retrieve the data from the database and, thanks to your help, to save it in a process variable as well. But we are not sure how to continue from there.

We built our forms using plain HTML but as far as we know we cannot use it to create a table of dynamic length. Our initial idea was to use JavaScript to generate the necessary code client-sided and, this is where we struggled, transfer the data for the table using JSON. As written in my first post, we retrieve the data to be displayed from an Oracle database.
However, we have never used JavaScript and JSON. Furthermore, we think that the communication between the client and the server might prove to be difficult.

What you suggest looks certainly more professional and error-proof. Could you please give us a short example of how to use the dataList you have saved in the process variable to create the table?
For this task specifically, we need to show a table with two columns.

Cheers,
Max

Hi @Maximilian_Suckow,

please look into our documentation. There, you can find explanation and examples how you can implement a task form with html and javascript. Furthermore, you see how you can handle process variables in a form.

https://docs.camunda.org/manual/7.8/reference/embedded-forms/

You can access with the following code example the process variable data.

  <script cam-script type="text/form-script">
    camForm.on('form-loaded', function() {
      // tell the form SDK to fetch the variable named 'xxx'
      camForm.variableManager.fetchVariable('data');
    });

    camForm.on('variables-fetched', function() {
      // work with the variable (bind it to the current AngularJS $scope)
      $scope.dataList = camForm.variableManager.variableValue('data);
    });
 </script>

The next code snippet shows, how you can create a table with 2 columns and the content of the process variable data.

<table>
  <thead>
  <tr>
    <th>Column A</th>
    <th>Column B</th>
  </tr>
  </thead>
  <tbody ng-repeat="data in $scope.dataList track by $index">
    <tr>                          
      <td><input type="text" value="{{data.valueA}}" readonly /></td>           
      <td><input type="text" value="{{data.valueB}}" readonly /></td>
    </tr>
  </tbody>
</table>

Cheers
kristin