0
我正在處理表單,它有一個選擇dropdown.in,該下拉菜單顯示幾個選項。如果從下拉列表中選擇某個選項,我想禁用某些字段。從選擇下拉菜單中選擇一個選項時禁用其他字段
例如在我的交易類型中,如果我選擇「公司內部」選項,我想禁用所有以下字段('選擇銀行','分行名稱','資金轉賬備註')。
如何做到這一點?我試過的東西,但沒有work.I'll張貼在這裏
形式
<ion-content class="has-header" scroll="true" padding="true">
<form id="myForm">
<label><h4><b>Beneficiary Name</b></h4></label>
<input type="text" id="beneName" name="beneName" ng-model="data.beneName" class="item-input-wrapper" >
<br>
<label><h4><b>Source Account Number</b></h4></label>
<select id="originAcc" style="margin: auto; width:100%; " ng-model="data.origin" ng-options="account.account for account in accountsArr">
<option value="" selected="selected">--Select Account--</option>
</select><br><br>
<label><h4><b>Transfer Amount</b></h4></label>
<input type="number" id="amount" name="amount" ng-model="data.amount" class="item-input-wrapper" decimal-places onkeypress='return event.charCode >= 48 && event.charCode <= 57 || event.charCode == 46'>
<br>
<label><h4><b>Beneficiary Account Number</b></h4></label>
<input type="text" id="beneAcc" name="beneAcc" ng-model="data.beneAcc" class="item-input-wrapper" >
<br>
<label><h4><b>Transaction Type</b></h4></label>
<select id="transtype" style="margin: auto; width:100%; " ng-model="data.transtype" ng-options="type.type for type in types" ng-change="hideFields()">
<option value="" selected="selected">--Select Transaction Type--</option>
</select>
<br><br>
<label><h4><b>Select Bank</b></h4></label>
<select id="beneBank" style="margin: auto; width:100%; " ng-model="data.beneBank" ng-options="bank.bank for bank in banks" ng-disabled="disableFields">
<option value="" selected="selected">--Select Bank--</option>
</select>
<br><br>
<label><h4><b>Branch Name</b></h4></label>
<select id="bname" style="margin: auto; width:100%; " ng-model="data.bname" ng-options="bname.bname for bname in bname" ng-disabled="disableFields">
<option value="" selected="selected">--Select Branch Name--</option>
</select>
<br><br>
<label><h4><b>Fund Transfer Remarks</b></h4></label>
<input type="text" id="narration" name="narration" ng-model="data.narration" class="item-input-wrapper">
<ion-checkbox ng-model="isChecked">Save as beneficiary</ion-checkbox>
<div class="col" style="text-align: center">
<button align="left" class="button button-block button-reset" style="display: inline-block;width:100px;text-align:center " ng-click="reset()" padding-top="true">Reset</button>
<button class="button button-block button-positive" style="display: inline-block;width:100px;margin-left:auto; margin-right:auto; " ng-click="thirdPartySubmit(data)" padding-top="true" >Transfer</button>
</div>
</form>
</ion-content>
</ion-view>
myController的
.controller('thirdpartyTransferCtrl', ['$scope','$rootScope', 'checkEmptyObjects', 'refreshTextFields', '$http', '$ionicPopup', 'ApplicationSettings', function($scope, $rootScope, checkEmptyObjects, refreshTextFields, $http, $ionicPopup, ApplicationSettings) {
$scope.hideFields = function() {
if($scope.transtype == "Within Company") {
$scope.disableFields = true;
}
else{
$scope.disableFields = false;
}
};
$scope.types = [
{ type: 'Within Company' },
{ type: 'SLIPS Transction' },
{ type: 'CEFT Transction' },
];
$scope.banks = [
{ bank: 'Sampath Bank' },
{ bank: 'Seylan Bank' },
{ bank: 'BOC' },
];
$scope.bname = [
{ bname: 'Colombo 05' },
{ bname: 'Colombo 06' },
{ bname: 'Colombo 07' },
{ bname: 'Wanathamulla' },
];
}])
在這裏plunker剛試過是鏈接http://plnkr.co/edit/b7iODzCUjfe9Mp5dCzMt – Luffy 2014-09-25 11:07:27
我想,但如果我把你確切的代碼複製和粘貼以上仍然無法工作:( – CraZyDroiD 2014-09-25 11:41:12
(不包括控制器參數),並將其添加到一個空白的角度項目,然後進行上面提出的更改,它適用於我..也許你已經改變了自發布問題以來的代碼稍微?另外,請檢查您的Javascript控制檯。 – Mac 2014-09-25 11:53:06