[英]Bootstrap - On selection change in dropdown, make the text control mandatory
我的表單中有一個選擇控件和一個文本控件。 當選擇發生更改時(當用戶選擇特定值時),我希望使文本控件成為強制性的。 打開表單時,此文本控件不是必需的。 這可能嗎?
我正在使用bootstrap 3和AngularJS。 而且都是新手。
這是我的代碼:
<div class="form-group">
<label class="col-sm-2 control-label">Select an Option</label>
<div class="col-sm-4">
<select class="form-control" name="type">
<option value="A">Option A</option>
<option value="B">Option B</option>
</select>
</div>
<div class="col-sm-4">
<input type="text" class="form-control" name="text" id="text" ng-model="text" >
<span class="help-block" style="color:red" ng-show="myform.text.$dirty && myform.text.$invalid">
<span ng-show="myform.text.$error.required">Required, when Option B is selected</span>
</span>
</div>
</div>
默認情況下,將選擇“選項A”,當用戶選擇“選項B”時,我希望我的文本控件成為強制性的。 打開表單時,這不是強制性的
任何幫助深表感謝
我將在選擇框中使用ng-change來設置$ scope屬性,該屬性將在文本字段中切換ng-required的值。
選擇框:
<select class="form-control" name="type" ng-model="optionValue" ng-change="setRequired()">
<option value="A">Option A</option>
<option value="B">Option B</option>
</select>
文字欄位:
<input type="text" class="form-control" name="text" id="text" ng-model="text" ng-required="textRequired" />
控制器:
function mainController($scope) {
$scope.optionValue = 'A';
$scope.textRequired = false;
$scope.setRequired = function() {
if($scope.optionValue==='B') {
$scope.textRequired= true;
}
else {
$scope.textRequired = false;
}
}
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.