ngx-sub-form icon indicating copy to clipboard operation
ngx-sub-form copied to clipboard

How to set only a single FormControl to disabled.

Open ChrTall opened this issue 3 years ago • 1 comments

I have a form with a field in the form model that should not be changed by the user and is filled automatically for create forms. I would still like to display this field to the user, but disable the input.

I tried the following, but the readOnlyProperty is still editable.

public baseForm = createForm<Entity, EntityFormModel>(this, { formType: FormType.ROOT, disabled$: this.disabled$, input$: this.input$, output$: this.updatedEntity, manualSave$: this.manualSave$, formControls: ChartFormComponent.getFormControls(), toFormGroup: (obj: Entity): EntityFormModel => { return mapEntityToEntityFormModel(obj); }, fromFormGroup: (formValue: EntityFormModel): EntityUnion => { return mapEntityFormModelToEntity(formValue); } });

private static getFormControls(): Controls<EntityFormModel> { return { // Should be disabled, but still shown to the user. readOnlyProperty: new FormControl({disabled: true}), discriminator: new FormControl(null), // Should and is editable. property: new FormControl(null) } }

ChrTall avatar Apr 27 '22 21:04 ChrTall

Yup I think this relates to a known issue with Angular on which I gave my input here: https://github.com/angular/angular/issues/11447#issuecomment-584740317

I think your best move for now is to either

simply display it without using an input (and therefore no need to make it disabled)

OR

Disable the input then use the remap function in the create form to read the value using the raw attribute or function on the form (can't remember on top of my head right now) and pass that instead of the classic form value that ngx sub form uses by default.

Hopefully that makes sense, I replied quite quickly, if it doesn't let me know

maxime1992 avatar Apr 28 '22 08:04 maxime1992