MVC5 динамически отключает текстовое поле на основе другого значения текстового поля - PullRequest
Новая
       35

MVC5 динамически отключает текстовое поле на основе другого значения текстового поля

1 голос
/ 26 апреля 2019

У меня есть проект MVC5, у меня есть 2 поля для ввода текста (идентификатор клиента, идентификатор документа) и один раскрывающийся список.

Я хотел бы динамически включать или отключать текстовое поле идентификатора клиента и раскрывающийся список на основе значения идентификатора документа, например, если я что-то написал в текстовое поле идентификатора документа, я хотел бы, чтобы текстовое поле идентификатора клиента и раскрывающийся список были отключены , если я удаляю текст из текстового поля идентификатора документа, я хотел бы видеть включенное текстовое поле идентификатора клиента и раскрывающийся список.

Пока я провел исследование и, честно говоря, не смог найти точного ответа. Я читал кое-что о jquery, но я очень слаб в JavaScript.

Вот мой код. Как мне достичь желаемого результата? 

<span>@Html.DisplayNameFor(model => model.ClientId).ToString():</span>
@Html.TextBox("ClientId", Model.Count()>0? Model.FirstOrDefault().ClientId:"", new { @class = "inline" })

<span>@Html.DisplayNameFor(model=>model.DocumentIdentificationId).ToString():</span>
@Html.TextBox("DocumentIdentificationId", Model.Count() > 0 ? Model.FirstOrDefault().DocumentIdentificationId: "", new {@class = "inline" })

<span>@Html.DisplayNameFor(model => model.DocumentType).ToString():</span>
@Html.DropDownList("DocumentTypes", new SelectList(documentTypes, "DocType", "DocName"),"", new { @class = "inline" })

1 Ответ

3 голосов
/ 26 апреля 2019

Вы можете написать скрипт для этого.

Поскольку @Html.TextBox("ClientId", Model.Count()>0? Model.FirstOrDefault().ClientId:"", new { @class = "inline" }) сгенерирует входной тег с id = ClientId

Вы можете использовать событие изменения или событие keyup по вашему требованию. 

$("#ClientId").keyup(function(){
   if($(this).val() != ""){
      $("#DocumentIdentificationId").attr("disabled", "disabled"); 
      $("#DocumentTypes").attr("disabled", "disabled"); 
   }else{
      $("#DocumentIdentificationId").prop("disabled", false); 
      $("#DocumentTypes").prop("disabled", false); 
   }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
   <input type="text" id="ClientId" />

   <input type="text" id="DocumentIdentificationId" />

    <select id="DocumentTypes">
       <option>Test<option>
    </select>
...