C# 如何在选择第一个或第二个下拉菜单时禁用下拉菜单
我有两个下拉列表 我正在用产品代码(第一个下拉列表)和产品名称(第二个下拉列表)填充它们。我需要根据选择禁用下拉列表。假设我选择了第一个下拉菜单,然后禁用第二个下拉菜单。反之亦然,选择第二个下拉列表,然后需要禁用第一个下拉列表C# 如何在选择第一个或第二个下拉菜单时禁用下拉菜单,c#,bootstrap-4,angular6,angular7,dropdown,C#,Bootstrap 4,Angular6,Angular7,Dropdown,我有两个下拉列表 我正在用产品代码(第一个下拉列表)和产品名称(第二个下拉列表)填充它们。我需要根据选择禁用下拉列表。假设我选择了第一个下拉菜单,然后禁用第二个下拉菜单。反之亦然,选择第二个下拉列表,然后需要禁用第一个下拉列表 <select id="Code" class="form-control" placeholder="Code" disabled="stockForm.get('productName')?.value" formControlName="pr
<select id="Code" class="form-control" placeholder="Code"
disabled="stockForm.get('productName')?.value"
formControlName="productId" required>
<option [value]="''">Select Code</option>
<option [value]="product.productId"
*ngFor="let product of productData">
{{product.sku}}
</option>
</select>
<select id="name" class="form-control" placeholder="Name"
disabled="stockForm.get('productId')?.value"
formControlName="productName" required>
<option [value]="''">Select Name</option>
<option [value]="product.productName"
*ngFor="let product of productData">
{{product.productName}}
</option>
</select>
选择代码
{{product.sku}}
选择名称
{{product.productName}
下面给出的代码是您需要的,如果用户再次选择所选选项,所有下拉列表都将启用,以便他们可以重新选择其他下拉选项
双向数据绑定([(禁用)]=“productNameSelected”)用于执行此操作。
HTML:
<select id='selectProductCode' (change)="productCodeChanged($event)" [(disabled)]="productNameSelected" >
<option value="0">Choose code </option>
<option value="1">Code1</option>
<option value="2">Code2</option>
</select>
<select id='selectProductName' (change)="produvtNameChanged($event)" [(disabled)]="productCodeSelected" >
<option value="0">Choose name </option>
<option value="1">Name1</option>
<option value="2">Name 2</option>
</select>
productCodeSelected: boolean = false;
productNameSelected: boolean = false;
productCodeChanged(args) {
var value = args.target.value;
if (value > 0) {
this.productCodeSelected = true;
}
else {
this.productCodeSelected = false;
}
}
produvtNameChanged(args) {
var value = args.target.value;
if (value > 0) {
this.productNameSelected = true;
}
else {
this.productNameSelected = false;
}
}