Typeahead not restoring value properly in form

Camunda 7 Topics Discussion & Questions
,
1

Hi all,

I’d like to use the typeahead directive to autocomplete user input. It is actually working fine when the user completes the form (presses the “Complete”-button). However, if the user saves the form (using the “Save”-button) und reloads the task, the value is not loaded properly. It does load the data but it also displays the suggestion for autocompletion. What do I need to change to properly load the stored value?

The form I use looks like this:

<form role="form" name="form">
<input required type="text" cam-variable-name="test" cam-variable-type="String" class="form-control"
typeahead-editable="false" uib-typeahead="name for name in names | filter:$viewValue | limitTo:8" />

<script cam-script type="text/form-script">
camForm.on(‘form-loaded’, function () {
$scope.names = [‘aaa’, ‘bbb’, ‘ccc’];
});
</script>
</form>

Thanks in advance for your help!

Edit: The preformatted text did not work, I had to manually escape the html. Sorry.

2

I have found a workaround:

First, you need to initialize the variable in a separate task, i.e. in a Java-Delegate:

execution.setVariable(“test”, “”);

Then, change the form as follows:

<form role="form" name="form">
<input required type="text" class="form-control" ng-model="tmp" typeahead-editable="false" uib-typeahead="name for name in names | filter:$viewValue | limitTo:8" />

<script cam-script type=“text/form-script”>
const variableManager = camForm.variableManager;
camForm.on(‘form-loaded’, function () {
variableManager.fetchVariable(‘test’);
});
camForm.on(‘variables-restored’, function () {
$scope.tmp = variableManager.variable(‘test’).value;
});
camForm.on(‘store’, function () {
variableManager.variableValue(‘test’, $scope.tmp);
});
camForm.on(‘submit’, function(evt) {
variableManager.variableValue(‘test’, $scope.tmp);
});
</script>
</form>