2

I have a dynamic form with repeated checkbox list. Please see https://stackblitz.com/edit/angular-5jdnb5

If a checkbox option is checked in one checkbox list, the same option has to be disabled in other lists. For example, if option Life is checked in first list, the Life checkbox should be disabled in other lists.

How do i implement the logic. Please suggest.

Improve this question

2 Answers 2

Reset to default
1

You simply need to report this to the top page every time the checkbox's content changes. It's a good solution to communicate with events for this reporting process. Below is the corrected and running application you want. I'm going to edit my answer later.

https://stackblitz.com/edit/angular-bzqbeq

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

1 Comment

This is a cool solution, but can we do this way, i checked the '{Life}' checkbox in first list, disable the same element in other checkbox list. When i uncheck the '{Life}' checkbox, other '{Life}' will be enabled.. Sorry, i couldn't upvote because of low reputation.
0

I have created a simpliifed demo HERE which can be understood by mass audience.

The main concept here is to maintain an object of options and the corresponding list id which is used to maintain which list option to disable.

No need to pass data between components, just simple object manipulation on the component template to enable/disable checkboxes

Improve this answer

2 Comments

Thanks. This is more kind of solution that i was looking for. Now i have to find a workaround for [disabled] attribute since it does not work with reactive forms and form controller.
@Dev05 Yes i know. I still need to learn how to build reactive forms.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.