获取控制器angularjs中窗体的单选按钮选定值



我正在尝试使用document.write(仅限于目前(来回显单选按钮的选定值所以它实际上造成了代码的问题

JavaScript代码:

$scope.Next = function(){
var queid = $scope.id1;
var ans = $scope.radio;
document.write(queid);
document.write(ans);
}

HTML代码:

<form style="text-align:left;width:90%;margin-left:10px;" ng-controller="dropdownCtrl">
<div class="tab" ng-repeat="e in disp">
<p>{{e.question}}</p>
<input type="hidden" ng-model="id1"  ng-init="id1=e.id" name="id1" ng-value="{{e.id}}" />
<label class="container2">Option A : {{e.option_a}}
<input type="radio" checked="checked" ng-model="radio" name="radio1" ng-value='"option_a"'>
<span class="checkmark"></span></label>
<label class="container2">Option B : {{e.option_b}}
<input type="radio" ng-model="radio" name="radio1" ng-value='"option_b"'>
<span class="checkmark"></span></label>
<label class="container2">Option C : {{e.option_c}}
<input type="radio" ng-model="radio" name="radio1" ng-value='"option_c"'>
<span class="checkmark"></span></label>
<label class="container2">Option D : {{e.option_d}}
<input type="radio" ng-model="radio" name="radio1" ng-value='"option_d"'>
<span class="checkmark"></span></label>
</div>
<div style="overflow:auto;">
<div style="float:right;">
<button type="button" ng-click="Next()" style="background:#acddde;color:black;border-radius:3px;border:none;width:80px;height:30px;">Next</button>
</div>
</div>
</form>

唯一有效的更改是将ng repeat以形式。。。因为它还包括按钮。因此,我们可以在表单中使用ng repeat,或者使用一个div,它覆盖了从第一个输入到最后一个按钮的整个表单内容,并将ng repeat添加到该div中。

JavaScript代码:

$scope.Next = function(){
var queid = $scope.id1;
var ans = $scope.radio;
document.write(queid);
document.write(ans);
}

Html代码:

<form style="text-align:left;width:90%;margin-left:10px;" ng-controller="dropdownCtrl" class="tab" ng-repeat="e in disp">
<p>{{e.question}}</p>
<input type="hidden" ng-model="id1"  ng-init="id1=e.id" name="id1" ng-value="{{e.id}}" />
<label class="container2">Option A : {{e.option_a}}
<input type="radio" checked="checked" ng-model="radio" name="radio1" ng-value='"option_a"'>
<span class="checkmark"></span></label>
<label class="container2">Option B : {{e.option_b}}
<input type="radio" ng-model="radio" name="radio1" ng-value='"option_b"'>
<span class="checkmark"></span></label>
<label class="container2">Option C : {{e.option_c}}
<input type="radio" ng-model="radio" name="radio1" ng-value='"option_c"'>
<span class="checkmark"></span></label>
<label class="container2">Option D : {{e.option_d}}
<input type="radio" ng-model="radio" name="radio1" ng-value='"option_d"'>
<span class="checkmark"></span></label>
<div style="overflow:auto;">
<div style="float:right;">
<button type="button" ng-click="Next()" style="background:#acddde;color:black;border-radius:3px;border:none;width:80px;height:30px;">Next</button>
</div>
</div>
</form>

最新更新