Dynamic form field with ng-repeat

Camunda 7 Topics Discussion & Questions
,
1

Hi all,

I’m having trouble creating dynamic input fields using camunda 7.4 (angular 1.2.16).
I have a multi select box (selectize) where some products can be selected.
For each selected product, I want the user to input an amount. This is the input control in the ng-repeat directive.

Problem is that I cannot get cam-variable-name work together with expression evaluation. as e.g.: cam-variable-name="{{ 'amount-' + product.id}}"
This is probably related to the fact that this syntax is I beleive only available in version 1.3+ of Angular.

<div class="form-group">
            <label for="productTypeSelection">Products</label>
            <div class="row">
                <div class="col-sm-6">
                    <select selectize config="myConfig"
                            options="productChoices"
                            ng-model="selectedProducts"
                            id="productTypeSelection"
                            name="productSelect">
                    </select>
                </div>
            </div>
        </div>
        <div class="form-group" ng-show="!!selectedProductObjects.length">
            <label>Product Amounts</label>
            <div class="row" ng-repeat="product in selectedProductObjects track by $index">
                <ng-form name="repeatForm">
                     <div class="col-sm-6">
                    {{product.name}} <input type="number" name="productId" cam-variable-name="{{ 'amount-' + product.id}}"
                                            cam-variable-type="Integer" class="form-control" min="1" required/>
                </div>
                </ng-form>
            </div>
        </div>

Does anyone has any experience with this sort of problem? Any hints perhaps?
Otherwise I’m obliged to handle it all manually and append it myself to the variableManager which I hope to avoid.

2

Hi! Did you find a solution for the expression evaluation problem of the cam-variable-name directive?

Regards
Mathias

3

Hi Mathias,

No, there is no solution when using cam-variable-name. I’m initializing a collection of objects now with ng-init inside the ng-repeat directive. There I allocate the product ID to the id of the object and the ng-model of my amount inputfield is as follows; ng-model="selectedProducts[$index].amount"

Unfortunately this required another piece of code when the looped collection (selectedProductObjects in my case) decreases in size but altogether it works…

1 Like