Disable the entire form at once (Angular reactive form)

Question

Is there any way to disable the entire form in angular when using Reactive forms. I know it is possible to make them disable one by one.

 this.tempForm = this.fb.group({
  m26_type:  '',
  m26_name:  ''
 })
this.tempForm.get('m26_type').disable();

Is it possible to disable the whole form rather than make every controller disable separately?

Have a look at AbstractControl.disable

Philipp
– Philipp

2017-08-24 06:04:21 +00:00
Commented Aug 24, 2017 at 6:04 — Philipp
– Philipp, Commented Aug 24, 2017 at 6:04

Rahul Singh · Accepted Answer · 2017-08-24 06:19:51Z

62

this.tempForm.disable();

Disables the control. This means the control will be exempt from validation checks and excluded from the aggregate value of any parent. Its status is DISABLED.

If the control has children, all children will be disabled to maintain the model.

LINK

UPDATE

Plunker link - https://plnkr.co/edit/CFC4uKpvfE4otJ2PWdkc?p=preview

edited Aug 24, 2017 at 6:19

answered Aug 24, 2017 at 6:14

Rahul Singh

19.7k13 gold badges69 silver badges96 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Rahul Singh Over a year ago

@Freak001 updated the code with a plunker link check that

Rahul Singh Over a year ago

@Freak001 jope it helped ?

yashodha_h Over a year ago

Yeah it helped. In my case problem was I am using custom form controls in reactive forms. When using custom form controls i reactive forms need to implement setDisabledState(). angular.io/api/forms/ControlValueAccessor

Meliovation Over a year ago

Remember for template driven forms the code is ngFormName.form.disable() or enable(). Also they are functions as the properties 'disabled' and 'enabled' are read-only.

rbr94 · Accepted Answer · 2022-04-27 10:43:02Z

1

If you use the template driven (with ngModel) you can add to your code also

<form #myForm="ngForm">
//at ts
//create view child
@viewChild('myForm')form:any;
//and in your function of reset
this.form.disable()

edited Apr 27, 2022 at 10:43

rbr94

2,2874 gold badges27 silver badges40 bronze badges

answered Apr 27, 2022 at 9:49

sari

576 bronze badges

Collectives™ on Stack Overflow

Disable the entire form at once (Angular reactive form)

2 Answers 2

4 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related