Here's what I have:
I have a table with student data such as ID, Name, LastName, and From. I recently added a new class to the project called BankAccount.
Each student can have zero or more accounts which I have added through a data-binding process.
My current goal is to select a student and display their accounts (if any) in a listBox on the same page. This is the code I have so far:
The table containing student information:
<table border="1" name="tableStud" arrow-selector>
<tbody>
<tr>
<td>ID</td>
<td>First Name</td>
<td>Last Name</td>
<td>From</td>
</tr>
<tr ng-repeat="student in result"
ng-class="{'selected':$index == selectedRow}"
ng-click="setSelected(student,$index)">
<td>{{ student.id }}</td>
<td>{{ student.firstname }}</td>
<td>{{ student.lastname }}</td>
<td>{{ student.mestorodjenja.ime }}</td>
</tr>
</tbody>
</table>
<select ng-model="student.accounts" multiple="multiple"
ng-options="account.name for account in student.accounts track by account.id"
>
</select>
In the controller, I have this function:
$scope.setSelected = function(student, index) {
$scope.student = student;
$scope.selectedRow = index;
};
Currently, my issue is that all the accounts in the listBox are selected and when I click on one, the others disappear but remain selected. Furthermore, if I switch to another student and then come back, the disappeared accounts are still missing and the old one remains selected.
My question is:
Is it possible to show the student and their accounts in the listBox without them being automatically selected, and also prevent them from disappearing after being clicked?
Thank you in advance!