[英]How can I set the default option in select box when an item was removed from the list - angularjs
I have an angularjs controller and html view which shows a list of employee names and if they are a supervisor or not and lastly a list of supervisors to choose from. 我有一个angularjs控制器和html视图,其中显示了雇员姓名列表,以及他们是否是主管,最后是可供选择的主管列表。 There will always be at least one default supervisor in the list, which in this case is Sally. 列表中将始终至少有一位默认主管,在这种情况下为Sally。
The supervisor dropdown can change according the "Is Supervisor?" 主管下拉菜单可以根据“主管”来更改。 selection. 选择。 If the employee is set to be a supervisor their name will appear in the dropdown. 如果将员工设置为主管,则其姓名将显示在下拉列表中。 If the employee is set not to be a supervisor, their name will be dropped from the supervisor list and subsequently the dropdown also. 如果将员工设置为不是主管,则其姓名将从主管列表中删除,然后也从下拉列表中删除。
In this example we have the default supervisor, Sally and one other employee, Tom, is also marked as a supervisor. 在此示例中,我们有默认主管Sally,另外一名雇员Tom也被标记为主管。
Lets change the supervisor of Harry to that of Tom. 让我们将哈里的主管换成汤姆。
Now if I change Tom to not be a supervisor anymore, I expect the supervisor dropdown for Harry to be changed to the default supervisor, Sally. 现在,如果我将Tom不再担任主管,我希望Harry的主管下拉菜单将更改为默认主管Sally。 But instead, a "blank" option appears in the drop down next to Harry instead. 但是,相反,在Harry旁边的下拉列表中出现了一个“空白”选项。
And that is the problem, does anyone have any suggestion on how to fix this? 这就是问题所在,有人对如何解决此问题有任何建议吗?
You can find the code at https://jsfiddle.net/w7gy6hn3/ 您可以在https://jsfiddle.net/w7gy6hn3/找到代码
<select ng-init="defaultSupervisorId = responsiblePerson.id"
ng-model="defaultSupervisorId"
ng-options="supervisor.id as (supervisor.name + ' ' + supervisor.id) for supervisor in supervisorList">
</select>
here is the updated fiddle https://jsfiddle.net/55uk6m8L/ just add the below extra code to your controller 这是更新的小提琴https://jsfiddle.net/55uk6m8L/只需将以下额外的代码添加到您的控制器
$scope.updateDropDown = function(employee) {
for(var i=0;i<$scope.employees.length;i++)
{
if($scope.employees[i] != employee && $scope.employees[i].defaultSupervisorId == employee.id )
{
$scope.employees[i].defaultSupervisorId = $scope.supervisorList[0].id;
}
}
};
call this function in your in $scope.updateSupervisorList functions inside else block after splice method 在splice方法之后在else块中的$ scope.updateSupervisorList函数中调用此函数
$scope.updateDropDown(employee);
and also in html , i change the these lines 而且在html中,我更改了这些行
<select ng-init="employeeInfo.defaultSupervisorId = responsiblePerson.id"
ng-model="employeeInfo.defaultSupervisorId"
ng-options="supervisor.id as (supervisor.name + ' ' + supervisor.id) for supervisor in supervisorList">
</select>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.