I am using "ng-repeat" to display 3 elements => Radio buttons- Yes/No, "Save" & "Cancel" buttons.
Objective of this question is to Enable only 1 HTML Attribute at a time in "ng-repeat" functionality.
"Save" button is repeated in each row, hence it should be enabled as soon as user clicks on either Yes or No in a particular row, Row-0 or Row-1 or Row-2.
The list of users (refer to images) contains Columns as Full-Name, Row-Index and Choice-Buttons, which are Radio-Buttons.
When a user clicks on "Yes" for Row-0, then "Save" button on Row-0 should be enabled,
and "Save" button on Row-1 should remain as disabled.
As a user clicks on Yes/No radio button, a function-call is made at Controller Side, which checks whether the Row-Index of the current row is same as Row-Index mentioned in the Save-button's id, i.e. ```id="{{$index}}-saveBtn"```.
If this match is found, then ```"var controller.isDisable"``` gets marked as false.
However, when user click on Yes/No of the Row-0, then both the Save buttons on Row-0 & Row-1 gets enabled.
Please suggest any correction in this approach or
any other better way to achieve this use-case.
As you can notice from the attached image, "Save" button's id is dynamic.
So, Row-0 Save Button has ```id = "0-saveBtn"``` and
Row-1 Save Button has ```id = "1-saveBtn"```.
Please refer to the images for more clarification.
[Image-1][1]
[Image-2][2]
[Image-3][3]
[Save-Button][4]
[1]: https://i.sstatic.net/Z4olzZam.png
[2]: https://i.sstatic.net/ZrcT9vmS.png
[3]: https://i.sstatic.net/pBZzyysf.png
[4]: https://i.sstatic.net/xFAKySzi.png
