多个 ng-options 下拉菜单无法正常工作?
Multiple ng-options dropdowns not working properly?
我是 angular 的新手,使用 ng-options 在下拉列表中显示值。
我在一种形式中总共有 4 个下拉列表。如果我先 select
下拉菜单的值,然后转到第二个下拉菜单 select any
value 然后首先下拉的值将消失。同样发生在
第三和第四。最后只有第四个下拉菜单的 selected 值我可以
看。
在成功表格上,我想显示弹出窗口。下面是我的下拉菜单和脚本代码。
<select ng-model="empInfo" ng-options="emp.candidate_name for emp in names4" class="span2">
</select>
<select ng-model="empInfo" ng-options="emp.company_name for emp in names" class="span2">
</select>
<select ng-model="empInfo" ng-options="emp.designation_type for emp in names1" class="span2">
</select>
var app = angular.module('myApp', ['720kb.datepicker']);
app.controller('MyController', function($scope, $http) {
$http.get("http://www.adhr.adnacgroup.com/ADHRM/companyJson.php")
.then(function(response) {
$scope.names = $scope.names = response.data.service;
});
$http.get("http://www.adhr.adnacgroup.com/ADHRM/designationJson.php")
.then(function(response) {
$scope.names1 = $scope.names1 = response.data.service;
});
$http.get("http://www.adhr.adnacgroup.com/ADHRM/finalCandidatesJson.php")
.then(function(response) {
$scope.names4 = $scope.names4 = response.data.service;
});
$scope.insertInfo = function(info) {
$http.post('addconfirmation.php?confirmation=',{
"referal_code":info.referal_code,
"candidate_id":info.candidate_id,
"company_id":info.company_id,
"designation_type_id":info.designation_type_id,
"address":info.address,
"joiningdate":info.joiningdate,
}).success(function(data1) {
if (data1 == true)
{
getInfo();
$('#empForm').css('display', 'none');
}
});
}
您必须在每个下拉菜单中分配不同的 scope
。在每个 select
标签上具有相同的 ng-model
然后一个覆盖另一个。
例如:
<select ng-model="empInfo1" ng-options="emp.company_name for emp in names">
<select ng-model="empInfo2" ng-options="emp.company_name for emp in names">
我是 angular 的新手,使用 ng-options 在下拉列表中显示值。 我在一种形式中总共有 4 个下拉列表。如果我先 select 下拉菜单的值,然后转到第二个下拉菜单 select any value 然后首先下拉的值将消失。同样发生在 第三和第四。最后只有第四个下拉菜单的 selected 值我可以 看。 在成功表格上,我想显示弹出窗口。下面是我的下拉菜单和脚本代码。
<select ng-model="empInfo" ng-options="emp.candidate_name for emp in names4" class="span2">
</select>
<select ng-model="empInfo" ng-options="emp.company_name for emp in names" class="span2">
</select>
<select ng-model="empInfo" ng-options="emp.designation_type for emp in names1" class="span2">
</select>
var app = angular.module('myApp', ['720kb.datepicker']);
app.controller('MyController', function($scope, $http) {
$http.get("http://www.adhr.adnacgroup.com/ADHRM/companyJson.php")
.then(function(response) {
$scope.names = $scope.names = response.data.service;
});
$http.get("http://www.adhr.adnacgroup.com/ADHRM/designationJson.php")
.then(function(response) {
$scope.names1 = $scope.names1 = response.data.service;
});
$http.get("http://www.adhr.adnacgroup.com/ADHRM/finalCandidatesJson.php")
.then(function(response) {
$scope.names4 = $scope.names4 = response.data.service;
});
$scope.insertInfo = function(info) {
$http.post('addconfirmation.php?confirmation=',{
"referal_code":info.referal_code,
"candidate_id":info.candidate_id,
"company_id":info.company_id,
"designation_type_id":info.designation_type_id,
"address":info.address,
"joiningdate":info.joiningdate,
}).success(function(data1) {
if (data1 == true)
{
getInfo();
$('#empForm').css('display', 'none');
}
});
}
您必须在每个下拉菜单中分配不同的 scope
。在每个 select
标签上具有相同的 ng-model
然后一个覆盖另一个。
例如:
<select ng-model="empInfo1" ng-options="emp.company_name for emp in names">
<select ng-model="empInfo2" ng-options="emp.company_name for emp in names">