Cuando mi documento está listo, tengo 1 o más formularios idénticos con selección y dos entradas que quiero mostrar (1 de ellos basado en selección dinámica).
Para 1 formulario es bastante simple, pero mi problema es que los formularios se generan dinámicamente como cuando tengo listo 1 formulario de selección de etiqueta que se ve así
<button type="button" class="add-document-item btn btn-success btn-sm pull-right"> <i class="glyphicon glyphicon-plus"></i> </button> <select id="type" class="form-control"> <option value="1">File 1</option> <option value="2">File 2</option> </select> <div class="col-md-12 system" id="system"> My YII2 active form field... </div> <div class="col-md-12 computer" id="computer"> My YII2 active form field... </div>Si después de abrir el documento y hay más de 1 formulario O hay uno y agrego más dinámicamente, SELECCIONE la identificación generando como "tipo 0", "tipo 1", "tipo 2" y lo mismo ocurre con las identificaciones de los campos de formulario.
Hasta ahora, solo puedo cambiar las entradas dinámicamente solo cuando se procesa 1 formulario
$(document).ready(function () { $('#computer').hide(); $(document).on('change', '#type', function () { var val = $('#type').val(); if (val == 2) { $('#system').show(); $('#computer').hide(); } else { $('#computer').show(); $('#system').hide(); } }); });Mi necesidad es cambiar la entrada seleccionada para cada forma individual generada. Estoy atascado para esto ya por algún tiempo. ¿Alguien puede ayudarme?
Este javascript que creé debería funcionar. Deberá aplicar esto a su propio código.
Declarar una matriz con todos los elementos del formulario
Seleccione todos los elementos que va a recorrer
Use forEach y sobrecárguelo con la matriz que creó
Cree una declaración if con el conjunto de filtros correcto
myArray = document.querySelectorAll('form') document.querySelectorAll('form').forEach(function(value, index, myArray){ if (myArray[index].getAttribute('id')=='system'){ console.log('system') //doSomething() } })Puede refactorizar esto reemplazando la segunda instancia de document.querySelectorAll('form') con myArray, pero para mayor claridad lo dejaré como está.