search

ngx-formly / ngx-formly

📝 JSON powered / Dynamic forms for Angular
https://formly.dev
MIT License
2.81k stars 566 forks source link

Disabling a field with expression affects other fields #3840

Closed ChristianKlima closed 5 months ago

ChristianKlima commented 10 months ago

When a field is set to disabled with an expression, other fields located below an element with the same key also become disabled. If disabled is simply set in the props without an expression, it has no effect on other fields. This can be observed in the example. Inheritance of disabled for direct children is good, but inheritance to other children with the same key is not desired. Often, there is a property placed between the parent elements that is not a direct child of the doubly set keys. Therefore there are two parent elements with the same key.

Thank you in advance, Merry Christmas, and a Happy New Year!

https://stackblitz.com/edit/angular-hz1kdp?file=src%2Fapp%2Fapp.component.ts,src%2Fapp%2Fapp.module.ts

DavWe commented 10 months ago

I added keys to both parent fields and the nested field with the key 'property2' does not get disabled. Then it works as expected (Stackblitz)

I not sure if thats really a bug, because setting a key fixes it.

ChristianKlima commented 10 months ago

I added keys to both parent fields and the nested field with the key 'property2' does not get disabled. Then it works as expected (Stackblitz)

I not sure if thats really a bug, because setting a key fixes it.

Thank you for your answer. You are right, if you set different keys to parent elements it behaves like expected. But that represents another model stucture. What if you have need exactly the model result like in the initial example? I think it's a bug and I don't understand why setting disabled without an expression behaves differently.

aitboudad commented 10 months ago

That's an expected result, nested is the parent of the following fields: property1 and property2: Parent disabled means all the child are disabled.

I think it's a bug and I don't understand why setting disabled without an expression behaves differently.

I may check it it should behave the same.

ChristianKlima commented 10 months ago

That's an expected result, nested is the parent of the following fields: property1 and property2: Parent disabled means all the child are disabled.

Okay, this means that the parent in the model hierarchy described by the keys holds more significance here than the hierarchy established in Formly through FormlyFieldConfigs. So, if I attempt to understand why a field is disabled, it's not enough to inspect the respective FormlyFieldConfig and its parents; I need to examine the keys of the FormlyFieldConfigs and consider that FormlyFieldConfigs (with the same key) placed in entirely different sections of the form might potentially have side effects on my property. This was precisely the issue I encountered as well. Troubleshooting might be challenging in such cases.

I would prefer if there were no side effects on fields that are not within the FieldConfig hierarchy. However, this might not be technically feasible?

Regardless, I would appreciate it if 'disabled' consistently behaves the same way, whether set via expression or directly through a property.

aitboudad commented 5 months ago

Okay, this means that the parent in the model hierarchy described by the keys holds more significance here than the hierarchy established in Formly through FormlyFieldConfigs.

That's right.

I would prefer if there were no side effects on fields that are not within the FieldConfig hierarchy. However, this might not be technically feasible?

Not feasible with the current API, fields that has the same key share internally the same formControl instance.