Loading

Disable Select List options Once Chosen another select List

Disable Select List options Once Chosen another select List

Abdalla Omran

5y1kLearn iOS Programming

I have two selected list

Branch and Warehouse

if i choose value of one of them the onther should be disabled

for example if i choosed a value from Branch then Warehouse should be disbaled and opposite is right .

<div class="form-group">
<label asp-for="Input.Branch">label>
<select asp-for="Input.Branch" id="branch" class="form-control">
<option value="">--Select Branch--option>
@foreach (var item in Model.BranchesList)
{
<option value="@item.BranchId.ToString()">@item.BranchNameoption>
}
select>
<span asp-validation-for="Input.Branch" class="text-danger">span>
div>
<div class="form-group">
<label asp-for="Input.Warehouse">label>
<select asp-for="Input.Warehouse" id="warehouse" class="form-control">
<option value="">--Select Branch--option>
@foreach (var item in Model.WarehousesList)
{
<option value="@item.WareHouseId.ToString()">@item.Nameoption>
}
select>
<span asp-validation-for="Input.Warehouse" class="text-danger">span>
div>
<button type="submit" class="btn btn-primary">Registerbutton>
form>
JavaScript :
$(document).ready(function () {
$("#branch").change(function () {
if ($(this).val() == "branch") {
$("#warehouse").attr('disabled', 'disabled');
}
else {
$("#warehouse").removeAttr('disabled');
}
});
});

4 Replies

Know the answer? Post it — somebody with the same question will find it here.

Sachin Singh5y ago
Accepted answer
1. $("#branch").change(function ()
2. {
3. $('#warehouse').attr('disabled', true);
4. });
5. $("#warehouse").change(function ()
6. {
7. $('#branch').attr('disabled', true);
8. });
+3

Abdalla Omran5y ago

Sachin Singh

thank you for your help

but how could i make them enable i mean not disable if i want to change the choise

at moment i have to refersh the page even be able to change the choise

+1

Abdalla Omran5y ago

Kiran Mohanty

i am using Razor page

+1

Kiran Mohanty

Kiran Mohanty5y ago

I think in MVC view itself we can achieve it as below. Assuming default value of "Input.Warehouse" and "Input.Branch" is null.

for="Input.Branch" id="branch" class="form-control" disabled="Input.Warehouse != null ? 'disabled' : null">
for="Input.Warehouse" id="warehouse" class="form-control" disabled="Input.Branch != null ? 'disabled' : null">

+1