También he leído muchos tutoriales y muchas respuestas sobre el desbordamiento de la pila, pero todavía no funciona para mí. Al seleccionar una opción (Sí) del menú desplegable -> debería mostrar la etiqueta <div> ; de lo contrario, <div> debería estar oculto.
A continuación se muestra mi código:
<h4>1. Does your school participate in the sponsored CAT4 scoring initiative?</h4> @{ List<SelectListItem> listItems = new List<SelectListItem>(); listItems.Add(new SelectListItem { Text = "Yes", Value = "True" }); listItems.Add(new SelectListItem { Text = "No", Value = "False" }); } <div class="form-group" id="PickOption"> <div class="col-md-10"> @Html.DropDownListFor(model => model.ParticipateInCAT4Scoring, listItems, "<----Select Yes or No---->", new { @class = "form-control" }) @Html.ValidationMessageFor(model => model.ParticipateInCAT4Scoring, "", new { @class = "text-danger" }) </div> </div> <div id="OnYes" class="form-group" style="display:none"> @Html.Label("For what Grade levels?", htmlAttributes: new { @class = "control-label col-md-2" }) <div class="col-md-10"> @Html.EditorFor(m => m.GradeLevelsCAT4, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(m => m.GradeLevelsCAT4, "", new { @class = "text-danger" }) </div> </div>A continuación se muestra el archivo de secuencia de comandos que estoy colocando en la parte inferior de la página Ver:
@section Scripts{ <script type="text/javascript"> $(document).ready(function () { $('#PickOption').on('change', function () { if ($(this).val() == 'True') { document.getElementById('OnYes').style.display = ""; } else { document.getElementById('OnYes').style.display = "none"; } }); }); </script> }PickOption es el ID del div envolvente.
Reemplace #PickOption en esta línea con la ID o el selector del cuadro de selección (generalmente generado automáticamente, pero puede especificarlo).
$('#PickOption').on('change', function () { Además, dado que está utilizando jQuery, puede simplemente hacer $('#OnYes').show();
Su selector no es correcto, asegúrese de vincular el evento en el menú desplegable, así que agregue una clase en el menú desplegable
@Html.DropDownListFor(model => model.ParticipateInCAT4Scoring, listItems, "<----Select Yes or No---->", new { @class = "form-control pickerDropdown" })Ahora vincule el evento en la clase agregada de esta manera:
$('.pickerDropdown').on('change', function () {