I have a page where there are some selects (representing the functions of the users, which can be: Leader, Participant or For Knowledge).
There are some business rules:
If the user is selected as LEADER, he / she can not have any other role , just have a Leader )2 - Should not contain more than one leader . For example, I have a list with 3 users and select one of them as LEADER, in the other selects the LEADER option should be disabled, since only a single user is allowed to be the Leader;
I've already been able to validate the selections already on the page, but have the option to add more users to the list. And that's where my validation does not work, because if I already have a LEADER (selected) and want to add another user to my list, then the new user's (which is added dynamically via JS) should already come with the LEADER disabled option, since in my list (before adding this new user)
How to do a check of the selected options, so that the validation works also on the new users that are added dynamically?
Example: link
Here is an example of my JS code that adds the dynamic select: