<vn-crud-model vn-id="model" url="TicketPackagings" fields="['id', 'ticketFk', 'packagingFk', 'quantity', 'created']" link="{ticketFk: $ctrl.$params.id}" data="packages" auto-load="true"> </vn-crud-model> <vn-watcher vn-id="watcher" data="packages" form="form"> </vn-watcher> <form name="form" ng-submit="$ctrl.onSubmit()" class="vn-w-md"> <vn-card class="vn-pa-lg"> <vn-horizontal ng-repeat="package in packages track by $index"> <vn-autocomplete vn-focus url="Packagings/listPackaging" label="Package" show-field="name" value-field="packagingFk" search-function="{or: [{itemFk: $search}, {'name': {like: '%'+ $search +'%'}}]}" ng-model="package.packagingFk"> <tpl-item> <div>{{::name}}</div> <div class="text-secondary text-caption"> #{{itemFk}} </div> </vn-autocomplete> <vn-input-number step="1" label="Quantity" ng-model="package.quantity" rule="TicketPackaging"> </vn-input-number> <vn-date-picker label="Added" ng-model="package.created" disabled="true" ng-readonly="true"> </vn-date-picker> <vn-auto> <vn-icon-button pointer vn-tooltip="Remove package" icon="delete" ng-click="model.remove($index)"> </vn-icon-button> </vn-auto> </vn-horizontal> <vn-icon-button vn-tooltip="Add package" vn-bind="+" icon="add_circle" ng-click="$ctrl.add()"> </vn-icon-button> </vn-card> <vn-button-bar> <vn-submit disabled="!watcher.dataChanged()" label="Save"> </vn-submit> <!-- #2680 Undo changes button bug <vn-button class="cancel" label="Undo changes" disabled="!watcher.dataChanged()" ng-click="watcher.loadOriginalData()"> </vn-button> --> </vn-button-bar> </form>