我在Angular-js中有一个下拉列表,其中包含条目列表。该下拉菜单旁边有一个按钮,它将再打开一个弹出窗口,并且有一个表格格式。它具有与每行相对应的无线电框列表。每个行的值与下拉值相同。挑战是当我选择其中一个行的此无线电按钮时,下拉列表应获得更新的值从下拉菜单中选择。
html:
<div class="form-group">
<div class="col-md-3" >
<select id="bidowner" ng-model="bidowner" ng-options= "item.name for item in owners" required>
<option ng-model = "bidOwner" value=''>Please Select</option>
</select>
<button class="btn btn-primary waves-effect waves-light m-b-15" alt="default" data-toggle="modal" data-target="#responsive-modal">
<a href="#" class="text-white">Check Availability</a>
</button>
</div>
</div>
<div id="responsive-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none; z-index: 9999">
<table class="table table-border">
<tbody>
<tr ng-repeat="x in list">
<td align="center"><input name="sales" id="" value="1" required="" type="radio" ng-click="onSelected(x.name)"></td>
<td>{{x.name}}</td>
<td>{{x.n1}}</td>
</tr>
</tbody>
</table>
JS:
var angularApp = angular.module("testApp", []);
app.controller("testController",function($scope,$http){
$scope.onSelected = function(value){
$scope.bidOwner=value;
}
});
我尝试这样做。
var angularApp = angular.module("testApp", []);
app.controller("testController",function($scope,$http){
$scope.onSelected = function(value){
$scope.bidOwner=value;
$scope.apply(); //add this line
}
});
<div class="form-group">
<div class="col-md-3" >
<select id="bidOwner" ng-model="bidowner" ng-options= "item.name for item in owners" required>
<option ng-model = "bidowner" value=''>Please Select</option>
</select>
<button class="btn btn-primary waves-effect waves-light m-b-15" alt="default" data-toggle="modal" data-target="#responsive-modal"><a href="#" class="text-white">Check Availability</a></button>
</div>
<div>
<div id="responsive-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none; z-index: 9999">
<table class="table table-border">
<tbody>
<tr ng-repeat="x in list">
<td align="center"><input name="sales" id="" value="1" required="" type="radio" ng-click="onSelected(x.name)"></td>
<td>{{x.name}}</td>
<td>{{x.n1}}</td>
</tr>
</tbody>
注意:您正在更新竞标者,但是NGMODEL名称是竞标者,这是案例Sentive