2个下拉选项后的文本框

时间:2017-05-31 05:00:39

标签: javascript

我是一个非常基本的代码用户,我正在尝试完成个人项目........

我已经完成了项目的第一部分,但是对于我的生活,我无法弄清楚最后的部分。

简而言之:我有两个下拉选项。第二个出现取决于第一个选择,并根据第一个选择填充。 (我已经完成了JavaScript,感谢此前的帖子。)

我接下来需要的是取决于第二个下拉菜单中的选项,文本框出现时带有文本值。第二个下拉列表中的每个选项都将生成不同的文本值/消息。

希望这是有道理的,有人可以帮助我

1 个答案:

答案 0 :(得分:0)

我有一个JSON文本和两个下拉列表。

第一个下拉列表,我将填充实体(申请人,人,计划)。第二个下拉列表将根据我们从第一个下拉列表中选择的实体类型填充属性值。

之后,我将根据您从第二个下拉列表中选择的值显示一个文本框。

请检查以下功能,如果需要更多信息,请与我们联系。



    var angular = angular.module('myApp', []);

    angular.controller('myCtrl', function($scope,$http) {

        $scope.data = [
            {
                "Attributes":[
                    {"name":"CSRPercent"},
                    {"name":"date"},
                    {"name":"hoursPerWeek"},
                    {"name":"householdSize"}
                ],
                "Entity":"Applicant"
            },
            {
                "Attributes":[
                    {"name":"age"},
                    {"name":"isPregnant"}
                ],
                "Entity":"Person"
            },
            {
                "Attributes":[
                    {"name":"company"},
                    {"name":"costPerPerson"},
                    {"name":"name"},
                    {"name":"premiumAssistance"},
                ],
                "Entity":"Plan"
            }
        ];
    });

<!DOCTYPE html>
<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">

  <select ng-model="dd1" ng-options="item.Entity for item in data">
  </select>

  <select ng-model="dd2" ng-options="ass.name for ass in dd1.Attributes"> 
  </select><br><br>

  <input ng-if="dd2" type="text" ng-model="dd2.name"><br><br>

</body>
</html>
&#13;
&#13;
&#13;