I want to give user option to either select a value from ddl or to enter one in the textbox. However, since both are sources for binded table field, both shouldn't be active simultaneous so I use a jquery to disable the texbox if a value is selected in ddl or to re-enable if none. But when I try to do the same for the ddl, re-enable it lose the source for the ddl. How it should be done?
- <div class="row no-gutters" onchange="funcLocation()">
- <div class="col-md-2">
- <label class="form-control text-white" style="background-color:mediumorchid;">Location </label>
- </div>
- @if (Model.RALocation == true)
- {
- <div class="col-md-3">
- <select id="LocS" class="form-control border-danger" asp-items="@Model.SelectLocation" asp-for="RiskAssessmentMain.Location">
- <option value="">--Select Location--</option>
- </select>
- </div>
- <span class="text-danger ml-2 mr-2">OR</span>
- }
- <div class="col-md-3">
- <input id="LocT" class="form-control" asp-for="RiskAssessmentMain.Location" placeholder="Enter New Location" />
- </div>
- </div>
jquery
- function funcLocation() {
- var data1 = $("#LocS :selected").text();
- var data2 = $("#LocT").val();
- if (data2.length > 0) {
- $("#LocS").empty();
- $("#LocS").attr("disabled", true);
- }
- else {
- $("#LocS").attr("disabled", false);
- $("#LocS").append("<option value=''>--Select Location--</option>");
- }
- if (data1 != "--Select Location--") {
- $("#LocT").empty();
- $("#LocT").attr("disabled", true);
- }
- else {
- $("#LocT").attr("disabled", false);
- }
- }