我有一个angujarJS应用程序,我有一个隐藏行的表单。如果在触发行中选择“是”,则会显示另一行,并显示“是”和“否”单选按钮。
如果在我的触发行中选择“否”,我正在尝试清除隐藏行的任何选定单选按钮,但我根本无法解决。
它可能很容易,但我只是代码盲目。
触发行
<div class="row">
<label class="col-sm-7 col-md-6">Show hidden row?</label>
<div class="col-sm-4">
<input name="firstgroup" type="radio" ng-model="transferitems.firstgroup" value="Yes" required />Yes
<input name="firstgroup" type="radio" ng-model="transferitems.firstgroup" value="No" required />No
</div>
</div>
隐藏行
<div class="row" ng-show="transferitems.firstgroup == 'Yes'">
<label class="col-sm-7 col-md-6">Is hidden row displayed?</label>
<div class="col-sm-4">
<input name="secondgroup" type="radio" ng-model="transferitems.secondgroup" value="Yes" required />Yes
<input name="secondgroup" type="radio" ng-model="transferitems.secondgroup" value="No" required />No
</div>
</div>
答案 0 :(得分:1)
您可以压缩Neel的答案并将该分配直接放在'No'元素的ng-click表达式中。它更紧凑,不必在$ scope中有额外的功能。
像这样:
<input name="firstgroup" type="radio" ng-model="transferitems.firstgroup"
ng-click="transferitems.secondgroup=''" value="No" required />No
答案 1 :(得分:0)
如果在触发行上添加ng-click
,如
<input name="firstgroup" type="radio" ng-model="transferitems.firstgroup" value="No" ng-click="triggerChange()" required />
然后你可以定义一个范围函数,你可以在那里检查第一行触发条件并相应地清除隐藏的单选按钮。
$scope.triggerChange = function(){
if($scope.transferitems.firstgroup=="No"){
$scope.transferitems.secondgroup='';
}
}
另一种方法是将$event
传递给ng-click="triggerChange($event)"
然后你可以比较值
if(event.target.value == "No"){
$scope.transferitems.secondgroup='';
}