gpt4 book ai didi

javascript - 从 html 的下拉列表中选择项目时禁用字段

转载 作者:行者123 更新时间:2023-12-03 11:46:19 28 4
gpt4 key购买 nike

我正在尝试制作一个表格,到目前为止我已经完成了所需的一切。但问题是我想在从选择下拉列表中选择项目时禁用多个字段。

例如,如果我从交易类型中选择“公司内部”选项,则应禁用下面的所有其他字段(不应输入数据)。我怎样才能实现这个目标?

在这里我将发布我的代码

<ion-content  class="has-header" scroll="true" padding="true">
<form id="myForm">
<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>Beneficiary Name</b></h4></label>
<input type="text" id="beneName" name="beneName" ng-model="data.beneName" class="item-input-wrapper" >
<br>
<label><h4><b>Transaction Type</b></h4></label>
<select id="transtype" style="margin: auto; width:100%; " ng-model="transtype" ng-options="type.type for type in types">
<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">
<option value="" selected="selected">--Select Bank--</option>
</select>
<br><br>

<label><h4><b>Branch Name</b></h4></label>
<select id="beneBank" style="margin:auto; width:100%;" ng-model="data.beneBank" ng-options="bname.bname for bname in bname">
<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">

<input type="checkbox" name="option1" value="beneficiary"> Save as beneficiary<br><br>

<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>

最佳答案

使用 ng-disabled//////

<select id="transtype"   style="margin: auto; width:100%; " ng-model="transtype" ng-options="type.type for type in types" data-ng-change="hideFields()">
<option value="" selected="selected">--Select Transaction Type--</option>

在 Controller 中

$scope.hideFields = function() {
if($scope.transtype == "within company") {
$scope.disableFileds = true;
}
}

在 View 中

<input type="text"  id="beneAcc" name="beneAcc" ng-model="data.beneAcc"  class="item-input-wrapper" ng-disabled="disableFileds">

//这样做可以禁用字段

/////////////////// https://docs.angularjs.org/api/ng/directive/ngDisabled

关于javascript - 从 html 的下拉列表中选择项目时禁用字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26032636/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com