I have a field that my user needs to input Yes or No. Based on which option he chooses, I need to open more fields to be filled.
<div >
<label for="Renda Bruta">Demonstrativo do Ano</label>
<div >
<select asp-for="servidorPublico">
<option value="Sim">Sim</option value="true">
<option value="Não">Não</option value="false">
</select>
</div>
</div>
The question is, how I do that? I need javascript for this, or will I have to call another view with this fields to be filled?
Both conditions will go to more fields to be filled, and one of them will have another Yes/No validation.
CodePudding user response:
You can simply add all fields in the view and at the from end show/hide divs containing the more fields based on the value of the select.
For this markup:
<div >
<label for="Renda Bruta">Demonstrativo do Ano</label>
<div >
<select id="yourSelectID" asp-for="servidorPublico">
<option value="Sim">Sim</option>
<option value="Não">Não</option>
</select>
</div>
<div id="simDivSpeceficItemsID">
//Some specific fields for the case
</div>
<div id="naoDivSpeceficItemsID">
//Some specific fields for the case
</div>
</div>
This sample code is using jQuery (so add reference to it) but it can also be done with pure javascript
$(function () {
$(document).ready(function() {
$("#yourSelectID").change(function () {
if ($(this).val() != "Sim") {
$("#simDivSpeceficItemsID").show();
$("#naoDivSpeceficItemsID").hide();
} else {
$("#simDivSpeceficItemsID").hide();
$("#naoDivSpeceficItemsID").show();
}
});
});
});