I am struggling to figure out the best approach for handling my current situation. Please take a moment to review.
Within the subject table, there are three subjects each with a unique ID. (ID, Name)
I am presenting each subject on the UI as child checkboxes within <ul> elements for three different students (parent checkboxes using <li>).
Example:
Andy
Math
English
Computer
John
Math
English
Computer
Murray
Math
English
Computer
Code:
<div>
<div>
<h5>Students Courses</h5>
</div>
<ul>
<li ng-repeat="student in Students">
<input type="checkbox" class="checkbox" id="{{student[0].Id}}"/>
<label for="{{student[0].Id}}"><span class="Radiobox-txt" id="{{student[0].Name}}">{{student[0].Name}}</span></label>
<ul>
<li ng-repeat="subject in student[0].Subjects">
<input type="checkbox" id="{{subject.Id}}" ng-model="subject.Checked" />
<label for="{{subject.Id}}"><span id="{{subject.Name}}">{{subject.Name}}</span></label>
</li>
</ul>
</li>
</ul>
</div>
Users can select subjects under each student and save their choices. Each subject's ID is unique and corresponds to the Student table.
Issue: For example, the subject Math has the same ID and appears for multiple students. When selecting Math for Murray, it also selects Math for Andy due to the shared ID.
Does anyone have suggestions on how to address this issue more effectively?
Please note that I do not want to assign different IDs to Math under different students as it would cause inconsistencies when storing these selections. The stored ID must match the original ID from the subject table.