如何从下拉列表中删除所有值,除了从另一个下拉列表中选择的值

时间:2017-07-01 15:16:02

标签: javascript jquery angularjs

我有三个下拉菜单: -

    <select clas="col-md-3" ng-model="a.userList" ng-change="selectValues(a.userList)">
        <option>AX</option>
        <option>AF</option>
        <option>AM</option>
        <option>BX</option>
        <option>BF</option>
        <option>BM</option>
        <option>CX</option>
        <option>CF</option>
        <option>CM</option>
        <option>DX</option>
        <option>DF</option>
        <option>DM</option>
</select>
<select clas="col-md-3" ng-model="a.userCode">
        <option>A</option>
        <option>B</option>
        <option>C</option>
        <option>D</option>
</select>
<select clas="col-md-3" ng-model="a.userId">
        <option>X</option>
        <option>F</option>
        <option>M</option>
</select>

我想要的是当用户选择AX然后从其他两个下拉列表中分别选择A和X,并从这两个下拉列表中删除所有其他值。

我的指令代码: -

               scope.selectValues = function(userList){
                    switch(userList){
                        case "AX" : scope.a.userCode = "A";
                                    scope.a.userId = "X";
                                    break;
                        case "AF" : scope.a.userCode = "A";
                                    scope.a.userId = "F";
                                    break;
                        case "AM" : scope.a.userCode = "A";
                                    scope.a.userId = "M";
                                    break;
                    };

                };

在上面的代码中,我能够选择我想要选择的特定值,但是无法从两个下拉列表中删除所有其他值。任何人都可以告诉我如何从下拉列表中删除值。

1 个答案:

答案 0 :(得分:1)

您应该将选项放在范围内!

<强> JS

scope.userList = ["AX","AF", "AM", "BX", "BF"];
//Obviously put all of your options in this array also for the other selects
scope.userCode = [....];
scope.userId = [....];

<强> HTML

  你需要

ng-options

 <select class="col-md-3" ng-model="a.userList"
     ng-options="option for option in topUserList track by $index"
     ng-change="selectValues(a.userList)"></select>

JS

 scope.selectValues = function(userList){
        scope.a.userCode = userList.charAt(0);
        scope.a.userId = userList.charAt(1);
        scope.userCode = [scope.a.userCode];
        scope.userId = [scope.a.userId];

 };