ASP.NET Core Динамическое скрытие и отображение Onchange

Question

Я новичок в ASP.NET Core, и я пытаюсь выяснить простейший способ скрыть/показать элементы на основе изменений значения полей. Например, если у меня есть следующие:

<select id="SelectDiv"> 
    <option value="">-- choose --</option> 
    <option value="Div1">Show Div1</option> 
    <option value="Div2">Show Div2</option> 
</select> 
<div id="DivContainer"> 
    <div id="Div1" class="hidden">I'm Div1!</div> 
    <div id="Div2" class="hidden">I'm Div2!</div> 
</div> 

и я выбираю «Show Div1», я хочу, чтобы «обновить» в DivContainer и обновлять классы стилей на основе выбора в раскрывающемся списке SelectDiv.

Эта логика выполнена на стороне сервера или на стороне клиента? Данные будут привязаны к модели, если это изменит подход к этому. Мне нужно будет выполнять многие из этих операций во всем моем приложении, и я просто пытаюсь найти лучший способ структурировать вещи.

Answer 1

Вам нужно сделать это на стороне клиента для быстрого ответа против действия пользователя с помощью jquery.

<script> 
 
    $("#SelectDiv").change(function(){ 
 
    $("#DivContainer div").addClass("hidden"); 
 
    var selectedDiv = $("#SelectDiv").val(); 
 
    
 
    $("#"+selectedDiv).removeClass("hidden"); 
 
    }); 
 
</script>

.hidden { 
 
    display:none; 
 
}

<select id="SelectDiv"> 
 
    <option value="">-- choose --</option> 
 
    <option value="Div1">Show Div1</option> 
 
    <option value="Div2">Show Div2</option> 
 
</select> 
 
<div id="DivContainer"> 
 
    <div id="Div1" class="hidden">I'm Div1!</div> 
 
    <div id="Div2" class="hidden">I'm Div2!</div> 
 
</div>