доступ выпадающее меню MVC выбранное значение в том же представлении

Question

У меня есть DropDownList и TextArea в представлении Razor. Я хочу, чтобы TextArea отображалась только в том случае, если выбрано определенное значение в раскрывающемся списке. какое решение для этого? Вот что я пробовал до сих пор, но это не совсем правильно, потому что предполагается, что значение типа Security установлено.

<tr> 
    <td style="width: 200px; height: 30px"> 
     @Html.LabelFor(model => model.SecurityTypeId) 
    </td> 
    <td style="width: 400px; height: 30px"> 
     @Html.DropDownListFor(model => model.SecurityTypeId, Model.SecurityTypes, dropdownHtmlAttrs) 
    </td> 
    <td>&nbsp;</td> 
</tr> 
<tr> 
    @if (Model.SecurityTypeId == (int)(SecurityType.Other)) 
    { 
     <td style="width: 200px; height: 30px"> 
      @Html.LabelFor(model => model.Details) 
     </td> 
     <td style="width: 400px; height: 30px"> 
      @Html.TextAreaFor(model => model.Details, new { Style = "width:240px" }) 
     </td> 
     <td>&nbsp;</td> 
    } 
</tr> 

Answer 1

Использование JQuery при обращении видимости просмотра элемента (ов) на стороне клиента события, с show или hide методом. Вот пример:

<script type="text/javascript"> 
$(document).ready(function() { 
    $('#SecurityTypeId').change(function() { 
      var value = $(this).val(); // get selected value 
      if (value == "set") { // this condition may adjusted to certain preset value 
       $('#Details').show(); // show text area 
      } 
      else { 
       $('#Details').hide(); // hide text area 
      } 
    }); 
}); 
</script> 

Если вы предпочитаете использовать ванильный JS:

<script type="text/javascript"> 
    var ddlvalue = document.getElementById("SecurityTypeId").value; 
    if (ddlvalue == "set") { 
     document.getElementById("Details")).style.visibility = "visible"; 
    } 
    else { 
     document.getElementById("Details")).style.visibility = "hidden"; 
    } 
</script> 

Эти сценарии выше предположим, идентификатор атрибута из DropDownListFor и TextAreaFor точно так же, как название модели связывания, в зависимости от ваших потребностей.

AFAIK, если оператор внутри Razor работает, когда просмотр, выполняющий обратный вызов или обратный вызов, таким образом изменяет видимость после функции ajax или отправки формы.

Любые предложения и улучшения приветствуются.

Ссылки:

how to hide and show text box according to select value using jquery

Show/hide control based on dropdown selection mvc 4 razor c#