merge from ecomp a88f0072 - Modern UI
[vid.git] / vid-webpack-master / src / app / shared / components / formControls / component / dropdown / dropdown.formControl.component.html
1 <div class="details-item" *ngIf="data != null && form != null">
2   <label [ngClass]="{'required': data.isRequired()}"
3          for="{{data?.dataTestId}}-select">{{data?.displayName}}:</label>
4   <select class="form-control input-text"
5           id="{{data?.dataTestId}}-select"
6           [attr.data-tests-id]="data?.dataTestId"
7           name="{{data?.name}}"
8           [formControl]="form.controls[data.controlName]"
9           [ngClass]="{'error-style' : (form?.controls[data?.controlName]?.touched && form?.controls[data?.controlName]?.errors) || data?.hasEmptyOptions ,
10                       'grayColor': form?.controls[data?.controlName]?.value == null || form?.controls[data?.controlName]?.value == undefined,
11                       'blackColor' : form?.controls[data?.controlName]?.value != null}"
12           (blur)="data.onBlur()">
13
14     <option [value]="null" hidden>{{data?.placeHolder}}</option>
15     <option *ngFor="let option of data?.options$ | orderBy : {property : 'name', direction : 1} ; let i = index" class="{{option?.id}} {{data?.dataTestId}}Option"
16             [value]="option[data.ngValue]" [disabled]="!option?.isPermitted && option?.isPermitted != undefined">{{option.name}}
17     </option>
18   </select>
19   <form-control-error *ngIf="data?.hasEmptyOptions" [message]="'No results for this request. Please change criteria.'"></form-control-error>
20 </div>
21