See this page for info on how to use cam-script to interact with process variables inside an embedded form.
https://docs.camunda.org/manual/latest/reference/embedded-forms/javascript/lifecycle/
I have a similar situation with a JSON list that I parse and then iterate through the entries to dynamically construct HTML for display. In my case I’m populating a div with dynamically generated form input radio buttons where the user has to select one of the entries that is submitted back with the form.
<script cam-script type="text/form-script">
var variableManager = camForm.variableManager;
camForm.on('variables-fetched', function() {
var oUsersInGroup = variableManager.variableValue('oUsersInGroup');
oUsersInGroup.forEach( function(user) {
// update some div.innerHTML here
}
}
camForm.on('submit', function() {
// selectedUser represents the name of the radio group created above
variableManager.createVariable({
name: 'selectedUser',
type: 'String',
value: $('input:radio[name=selectedUser]:checked').val(),
isDirty: true
});
}
</script>