diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
index 65b02125d9b..0bf385425ec 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
@@ -1,12 +1,8 @@
-<div
-    class="adf-dropdown-widget {{field.className}}"
-    [class.adf-invalid]="(!field.isValid && isTouched()) || isRestApiFailed"
-    [class.adf-readonly]="field.readOnly"
-    [class.adf-left-label-input-container]="field.leftLabels"
->
+<div class="adf-dropdown-widget {{field.className}}"
+     [class.adf-invalid]="(!field.isValid && isTouched()) || isRestApiFailed" [class.adf-readonly]="field.readOnly" [class.adf-left-label-input-container]="field.leftLabels">
     <div class="adf-dropdown-widget-top-labels">
-        <label class="adf-label" [attr.for]="field.id" [class.adf-left-label]="field.leftLabels"
-            >{{field.name | translate }}<span class="adf-asterisk" *ngIf="isRequired()">*</span>
+        <label class="adf-label" [attr.for]="field.id" [class.adf-left-label]="field.leftLabels">{{field.name | translate }}<span class="adf-asterisk"
+            *ngIf="isRequired()">*</span>
         </label>
     </div>
     <div>
@@ -14,48 +10,36 @@
             <mat-label *ngIf="getDefaultOption(list$ | async) as defaultOption">
                 {{ defaultOption.name }}
             </mat-label>
-            <mat-select
-                class="adf-select"
-                [id]="field.id"
-                [(ngModel)]="field.value"
-                [disabled]="field.readOnly"
-                [compareWith]="compareDropdownValues"
-                (ngModelChange)="selectionChangedForField(field)"
-                [matTooltip]="field.tooltip"
-                [required]="isRequired()"
-                panelClass="adf-select-filter"
-                (blur)="markAsTouched()"
-                matTooltipPosition="above"
-                matTooltipShowDelay="1000"
-                [multiple]="field.hasMultipleValues"
-            >
+            <mat-select class="adf-select"
+                        [id]="field.id"
+                        [(ngModel)]="field.value"
+                        [disabled]="field.readOnly"
+                        [compareWith]="compareDropdownValues"
+                        (ngModelChange)="selectionChangedForField(field)"
+                        [matTooltip]="field.tooltip"
+                        [required]="isRequired()"
+                        panelClass="adf-select-filter"
+                        (blur)="markAsTouched()"
+                        matTooltipPosition="above"
+                        matTooltipShowDelay="1000"
+                        [multiple]="field.hasMultipleValues">
                 <adf-select-filter-input *ngIf="showInputFilter" (change)="filter$.next($event)"></adf-select-filter-input>
 
-                <mat-option *ngFor="let opt of list$ | async" [value]="getOptionValue(opt, field.value)" [id]="opt.id">
-                    {{opt.name}}
-                </mat-option>
-                <mat-option id="readonlyOption" *ngIf="isReadOnlyType()" [value]="field.value">
-                    {{field.value}}
+                <mat-option *ngFor="let opt of list$ | async"
+                            [value]="getOptionValue(opt, field.value)"
+                            [id]="opt.id">{{opt.name}}
                 </mat-option>
+                <mat-option id="readonlyOption" *ngIf="isReadOnlyType()" [value]="field.value">{{field.value}}</mat-option>
             </mat-select>
         </mat-form-field>
-        <div *ngIf="!previewState && !field.readOnly">
+        <div *ngIf="!previewState">
             <error-widget [error]="field.validationSummary"></error-widget>
-            <error-widget
-                class="adf-dropdown-required-message"
-                *ngIf="showRequiredMessage()"
-                required="{{ 'FORM.FIELD.REQUIRED' | translate }}"
-            ></error-widget>
-            <error-widget
-                class="adf-dropdown-failed-message"
-                *ngIf="isRestApiFailed"
-                required="{{ 'FORM.FIELD.REST_API_FAILED' | translate: { hostname: restApiHostName } }}"
-            ></error-widget>
-            <error-widget
-                class="adf-dropdown-failed-message"
-                *ngIf="variableOptionsFailed"
-                required="{{ 'FORM.FIELD.VARIABLE_DROPDOWN_OPTIONS_FAILED' | translate }}"
-            ></error-widget>
+            <error-widget class="adf-dropdown-required-message" *ngIf="showRequiredMessage()"
+                        required="{{ 'FORM.FIELD.REQUIRED' | translate }}"></error-widget>
+            <error-widget class="adf-dropdown-failed-message" *ngIf="isRestApiFailed"
+                        required="{{ 'FORM.FIELD.REST_API_FAILED' | translate: { hostname: restApiHostName } }}"></error-widget>
+            <error-widget class="adf-dropdown-failed-message" *ngIf="variableOptionsFailed"
+                        required="{{ 'FORM.FIELD.VARIABLE_DROPDOWN_OPTIONS_FAILED' | translate }}"></error-widget>
         </div>
     </div>
 </div>
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.spec.ts b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.spec.ts
index 8e0866b7486..340dc227cb5 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.spec.ts
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.spec.ts
@@ -64,10 +64,11 @@ describe('DropdownCloudWidgetComponent', () => {
 
     describe('Simple Dropdown', () => {
         beforeEach(() => {
-            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false }), {
+            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
                 id: 'dropdown-id',
                 name: 'date-name',
                 type: 'dropdown',
+                readOnly: false,
                 restUrl: 'https://fake-rest-url',
                 options: [{ id: 'empty', name: 'Choose one...' }]
             });
@@ -119,18 +120,6 @@ describe('DropdownCloudWidgetComponent', () => {
             expect(await allOptions[2].getText()).toEqual('option_3');
         });
 
-        it('should NOT load data from restUrl when field is readonly', () => {
-            spyOn(formCloudService, 'getRestWidgetData');
-            widget.field.readOnly = true;
-            widget.field.restUrl = 'https://fake-rest-url';
-            widget.field.optionType = 'rest';
-            widget.field.restIdProperty = 'name';
-
-            widget.ngOnInit();
-
-            expect(formCloudService.getRestWidgetData).not.toHaveBeenCalled();
-        });
-
         it('should show error message if the restUrl failed to fetch options', async () => {
             const jsonDataSpy = spyOn(formCloudService, 'getRestWidgetData').and.returnValue(throwError('Failed to fetch options'));
             const errorIcon: string = 'error_outline';
@@ -205,7 +194,7 @@ describe('DropdownCloudWidgetComponent', () => {
             expect(widget.field.form.values['dropdown-id']).toEqual({ id: 'opt1', name: 'default1_value' });
         });
 
-        it('should NOT display required error for a non required dropdown when selecting the none option', async () => {
+        it('should not display required error for a non required dropdown when selecting the none option', async () => {
             widget.field.options = [{ id: 'empty', name: 'Choose empty' }, ...fakeOptionList];
 
             widget.ngOnInit();
@@ -220,7 +209,7 @@ describe('DropdownCloudWidgetComponent', () => {
             expect(requiredErrorElement).toBeFalsy();
         });
 
-        it('should NOT display required error when selecting a valid option for a required dropdown', async () => {
+        it('should not display required error when selecting a valid option for a required dropdown', async () => {
             widget.field.required = true;
             widget.field.options = [{ id: 'empty', name: 'Choose empty' }, ...fakeOptionList];
 
@@ -235,7 +224,7 @@ describe('DropdownCloudWidgetComponent', () => {
             expect(requiredErrorElement).toBeFalsy();
         });
 
-        it('should NOT have a value when switching from an available option to the None option', async () => {
+        it('should not have a value when switching from an available option to the None option', async () => {
             widget.field.options = [{ id: 'empty', name: 'This is a mock none option' }, ...fakeOptionList];
 
             widget.ngOnInit();
@@ -326,30 +315,15 @@ describe('DropdownCloudWidgetComponent', () => {
             const requiredErrorElement = fixture.debugElement.query(By.css('.adf-dropdown-required-message .adf-error-text'));
             expect(requiredErrorElement.nativeElement.innerText).toEqual('FORM.FIELD.REQUIRED');
         });
-
-        it('should NOT display a required error when dropdown is readonly', async () => {
-            widget.field.readOnly = true;
-            fixture.detectChanges();
-            await fixture.whenStable();
-
-            expect(element.querySelector('.adf-invalid')).toBeFalsy();
-
-            const dropdownSelect = element.querySelector('.adf-select');
-            dropdownSelect.dispatchEvent(new Event('blur'));
-
-            fixture.detectChanges();
-            await fixture.whenStable();
-
-            expect(element.querySelector('.adf-invalid')).toBeFalsy();
-        });
     });
 
     describe('filter', () => {
         beforeEach(() => {
-            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false }), {
+            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
                 id: 'dropdown-id',
                 name: 'option list',
                 type: 'dropdown',
+                readOnly: false,
                 options: filterOptionList
             });
             widget.ngOnInit();
@@ -396,10 +370,11 @@ describe('DropdownCloudWidgetComponent', () => {
 
     describe('multiple selection', () => {
         it('should show preselected option', async () => {
-            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false }), {
+            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
                 id: 'dropdown-id',
                 name: 'date-name',
                 type: 'dropdown',
+                readOnly: 'false',
                 options: fakeOptionList,
                 selectionType: 'multiple',
                 value: [
@@ -414,10 +389,11 @@ describe('DropdownCloudWidgetComponent', () => {
         });
 
         it('should support multiple options', async () => {
-            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false }), {
+            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
                 id: 'dropdown-id',
                 name: 'date-name',
                 type: 'dropdown',
+                readOnly: 'false',
                 selectionType: 'multiple',
                 options: fakeOptionList
             });
@@ -432,10 +408,11 @@ describe('DropdownCloudWidgetComponent', () => {
         });
 
         it('should show preselected option for rest options', async () => {
-            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false }), {
+            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
                 id: 'dropdown-id',
                 name: 'date-name',
                 type: 'dropdown',
+                readOnly: 'false',
                 restUrl: 'https://fake-rest-url',
                 optionType: 'rest',
                 selectionType: 'multiple',
@@ -471,10 +448,11 @@ describe('DropdownCloudWidgetComponent', () => {
         });
 
         it('should support multiple options for rest options', async () => {
-            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false }), {
+            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
                 id: 'dropdown-id',
                 name: 'date-name',
                 type: 'dropdown',
+                readOnly: 'false',
                 restUrl: 'https://fake-rest-url',
                 optionType: 'rest',
                 selectionType: 'multiple'
@@ -520,10 +498,11 @@ describe('DropdownCloudWidgetComponent', () => {
                 validate: () => true
             });
             beforeEach(() => {
-                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false }), {
+                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
                     id: 'child-dropdown-id',
                     name: 'child-dropdown',
                     type: 'dropdown',
+                    readOnly: 'false',
                     optionType: 'rest',
                     restUrl: 'myFakeDomain.com/cities?country=${parentDropdown}',
                     rule: {
@@ -626,10 +605,11 @@ describe('DropdownCloudWidgetComponent', () => {
             const parentDropdown = new FormFieldModel(new FormModel(), { id: 'parentDropdown', type: 'dropdown' });
 
             beforeEach(() => {
-                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false }), {
+                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
                     id: 'child-dropdown-id',
                     name: 'child-dropdown',
                     type: 'dropdown',
+                    readOnly: 'false',
                     optionType: 'manual',
                     rule: {
                         ruleOn: 'parentDropdown',
@@ -669,7 +649,7 @@ describe('DropdownCloudWidgetComponent', () => {
             });
 
             describe('Manual - On parent value changes (chain)', () => {
-                it('should reset the current value when it NOT part of the available options', () => {
+                it('should reset the current value when it not part of the available options', () => {
                     widget.field.options = mockConditionalEntries[1].options;
                     widget.field.value = 'non-existent-value';
                     fixture.detectChanges();
@@ -682,7 +662,7 @@ describe('DropdownCloudWidgetComponent', () => {
                     expect(widget.fieldValue).toEqual('');
                 });
 
-                it('should NOT reset the current value when it is part of the available options', () => {
+                it('should not reset the current value when it is part of the available options', () => {
                     widget.field.options = mockConditionalEntries[1].options;
                     widget.field.value = 'ATH';
                     fixture.detectChanges();
@@ -714,10 +694,11 @@ describe('DropdownCloudWidgetComponent', () => {
 
         describe('Load selection for linked dropdown (i.e. saved, completed forms)', () => {
             it('should load the selection of a manual type linked dropdown', () => {
-                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false }), {
+                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
                     id: 'child-dropdown-id',
                     name: 'child-dropdown',
                     type: 'dropdown',
+                    readOnly: 'false',
                     optionType: 'manual',
                     rule: {
                         ruleOn: 'parentDropdown',
@@ -737,10 +718,11 @@ describe('DropdownCloudWidgetComponent', () => {
 
             it('should load the selection of a rest type linked dropdown', () => {
                 const jsonDataSpy = spyOn(formCloudService, 'getRestWidgetData').and.returnValue(of(mockRestDropdownOptions));
-                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false }), {
+                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
                     id: 'child-dropdown-id',
                     name: 'child-dropdown',
                     type: 'dropdown',
+                    readOnly: 'false',
                     restUrl: 'mock-url.com/country=${country}',
                     optionType: 'rest',
                     rule: {
@@ -762,10 +744,11 @@ describe('DropdownCloudWidgetComponent', () => {
 
         describe('when form model has left labels', () => {
             it('should have left labels classes on leftLabels true', async () => {
-                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false, leftLabels: true }), {
+                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', leftLabels: true }), {
                     id: 'dropdown-id',
                     name: 'option list',
                     type: FormFieldTypes.DROPDOWN,
+                    readOnly: false,
                     options: filterOptionList
                 });
 
@@ -779,11 +762,12 @@ describe('DropdownCloudWidgetComponent', () => {
                 expect(adfLeftLabel).not.toBeNull();
             });
 
-            it('should NOT have left labels classes on leftLabels false', async () => {
-                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false, leftLabels: false }), {
+            it('should not have left labels classes on leftLabels false', async () => {
+                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', leftLabels: false }), {
                     id: 'dropdown-id',
                     name: 'option list',
                     type: FormFieldTypes.DROPDOWN,
+                    readOnly: false,
                     options: filterOptionList
                 });
 
@@ -797,11 +781,12 @@ describe('DropdownCloudWidgetComponent', () => {
                 expect(adfLeftLabel).toBeNull();
             });
 
-            it('should NOT have left labels classes on leftLabels NOT present', async () => {
-                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false }), {
+            it('should not have left labels classes on leftLabels not present', async () => {
+                widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
                     id: 'dropdown-id',
                     name: 'option list',
                     type: FormFieldTypes.DROPDOWN,
+                    readOnly: false,
                     options: filterOptionList
                 });
 
@@ -828,10 +813,11 @@ describe('DropdownCloudWidgetComponent', () => {
             processVariables?: TaskVariableCloud[],
             variables?: TaskVariableCloud[]
         ) =>
-            new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false, processVariables, variables }), {
+            new FormFieldModel(new FormModel({ taskId: 'fake-task-id', processVariables, variables }), {
                 id: 'variable-dropdown-id',
                 name: 'variable-options-dropdown',
                 type: 'dropdown',
+                readOnly: 'false',
                 optionType: 'variable',
                 variableConfig: {
                     variableName,
@@ -975,20 +961,5 @@ describe('DropdownCloudWidgetComponent', () => {
             const failedErrorMsgElement = fixture.debugElement.query(By.css('.adf-dropdown-failed-message'));
             expect(failedErrorMsgElement).toBeNull();
         });
-
-        it('should NOT display errors if field is readonly', () => {
-            widget.field = getVariableDropdownWidget(
-                'variables.wrong-variable-id',
-                'response.wrongPath.players',
-                'wrongId',
-                'wrongFullName',
-                mockProcessVariablesWithJson
-            );
-            widget.field.readOnly = true;
-            fixture.detectChanges();
-
-            const failedErrorMsgElement = fixture.debugElement.query(By.css('.adf-dropdown-failed-message'));
-            expect(failedErrorMsgElement).toBeNull();
-        });
     });
 });
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.ts b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.ts
index 38dd392c7bf..57e1e1e23bc 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.ts
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.ts
@@ -191,28 +191,26 @@ export class DropdownCloudWidgetComponent extends WidgetComponent implements OnI
     }
 
     private persistFieldOptionsFromRestApi() {
-        if (!this.isValidRestType() || this.field.readOnly) {
-            return;
+        if (this.isValidRestType()) {
+            this.resetRestApiErrorMessage();
+            const bodyParam = this.buildBodyParam();
+            this.formCloudService
+                .getRestWidgetData(this.field.form.id, this.field.id, bodyParam)
+                .pipe(takeUntil(this.onDestroy$))
+                .subscribe(
+                    (result: FormFieldOption[]) => {
+                        this.resetRestApiErrorMessage();
+                        this.field.options = result;
+                        this.updateOptions();
+                        this.field.updateForm();
+                        this.resetInvalidValue();
+                    },
+                    (err) => {
+                        this.resetRestApiOptions();
+                        this.handleError(err);
+                    }
+                );
         }
-
-        this.resetRestApiErrorMessage();
-        const bodyParam = this.buildBodyParam();
-        this.formCloudService
-            .getRestWidgetData(this.field.form.id, this.field.id, bodyParam)
-            .pipe(takeUntil(this.onDestroy$))
-            .subscribe(
-                (result: FormFieldOption[]) => {
-                    this.resetRestApiErrorMessage();
-                    this.field.options = result;
-                    this.updateOptions();
-                    this.field.updateForm();
-                    this.resetInvalidValue();
-                },
-                (err) => {
-                    this.resetRestApiOptions();
-                    this.handleError(err);
-                }
-            );
     }
 
     private buildBodyParam(): any {