Angularjs: Cascade Dropdown
I'm trying to achieve a cascade dropdown in Angular. I thought it would just work naturally thanks to binding. See below:
Solution 2:
It could be that your selectedRequest.client does not refer to the same object in clients array. Try this:
JS:
function testController($scope) {
$scope.clients = [
{ id: 1, name: "client1", departments: [{ id: 1, defaultLabel: 'department1' }, { id: 2, defaultLabel: 'department2'}] },
{ id: 2, name: "client2", departments: [{ id: 3, defaultLabel: 'department3' }, { id: 4, defaultLabel: 'department4'}] }
];
$scope.selectedRequest = {};
$scope.selectedRequest.client = $scope.clients[0];//Assign by object reference.
}
HTML:
<div ng-controller="testController">
<select name="client" ng-model="selectedRequest.client" ng-options="c.name for c in clients" required></select>
<select id="department" ng-model="selectedRequest.department" ng-options="d.defaultLabel for d in selectedRequest.client.departments"></select>
</div>
I removed track by to use the default (track by object reference) and ensure that selectedRequest.client refers to objects inside clients
Post a Comment for "Angularjs: Cascade Dropdown"