Hola, me gustaría agregar una función a mi formulario cuando selecciono una opción, luego algunas entradas de mi formulario están deshabilitadas. Traté de hacer esto en jquery pero algo no funciona. ¿Podría ayudarme con esto?
Hay un formulario de ejemplo:
<div class="col-4"> <label>Enabled </label> <select name="stato" id="stato" class="form-control"> <option value="Text1">Text1</option> <option value="Text2">Text2</option> <option value="Text3">Text3</option> <option value="Text4">Text4</option> </select> </div> <div class="col-4" > <label>Disabled when choose option in select</label> <input id="data_consegna" type="text" class="form-control" name="data_consegna" placeholder="Data Consegna" /> </div>y función en jquery
$(function() { $('#data_consegna').prop('disabled', true); $('#stato option').each(function() { if ($(this).is('selected')) { $('#data_consegna').prop('enabled', true); } else { $('#data_consegna').prop('enabled', false); } }); });enter code here $(function() { //Triggering change event handler on element #stato $('#stato').change(function() { var value = $(this).val(); //Getting selected value from #stato if (value == "") { $('.common_disable').prop('disabled', false); //If value is empty then disable another field } else { $('.common_disable').prop('disabled', true); //Else enable another field } }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <div class="col-4"> <label>Enabled </label> <select name="stato" id="stato" class="form-control"> <option value="">Select One</option> <option value="Text1">Text1</option> <option value="Text2">Text2</option> <option value="Text3">Text3</option> <option value="Text4">Text4</option> </select> </div> <div class="col-4" > <label>Disabled when choose option in select</label><br> <input id="data_consegna" type="text" class="form-control common_disable" name="data_consegna" placeholder="Data Consegna" /><br> <input id="data_consegna2" type="text" class="form-control common_disable" name="data_consegna2" placeholder="Data Consegna2" /><br> <input id="data_consegna3" type="text" class="form-control common_disable" name="data_consegna3" placeholder="Data Consegna3" /><br> </div>Verifique la solución anterior. Habilitará el cuadro de entrada en el nivel inicial. cuando seleccione un valor, deshabilitará el cuadro de entrada.