Obtuve lo siguiente en una vista parcial, que representa una fila que se agrega dinámicamente:
<td> <input asp-for="Id" class="form-control" /> </td> <td> <input asp-for="EnableDropDown1" id="EnableDropDown1Id" type="checkbox" class="form-control" /> </td> <td> <select asp-for="MyDropDown1" id="MyDropDownId1" asp-items="Html.GetEnumSelectList<MyEnum1Type>()" disable="disabled" class="form-control"></select> </td> <td> <input asp-for="EnableDropDown2" id="EnableDropDown2Id" type="checkbox" class="form-control" /> </td> <td> <select asp-for="MyDropDown2" id="MyDropDownId2" asp-items="Html.GetEnumSelectList<MyEnum2Type>()" disable="disabled" class="form-control"></select> </td>Pensé que tal vez una llamada onclick="EnableDropDown()" adjunta a CheckBox (que tomó una casilla de verificación y un parámetro desplegable) podría ser el truco, pero no mantiene el estado ni la casilla de verificación encuentra el menú desplegable apropiado. Podría recorrer todas las filas con un clic y habilitar/deshabilitar los menús desplegables de manera adecuada, pero esto parece una solución deficiente.
He visto algunas soluciones, pero ninguna de las simples funciona... ya sea porque no son dinámicas, o tal vez se deba a las múltiples casillas de verificación, o al hecho de que es una EnumSelectList y no un simple DropDown (¿Es hay alguna diferencia?)..
No estoy muy versado en javascript, así que estoy un poco perdido con este.
Primero, le falta una "d" en el atributo deshabilitado
Luego, si está agregando la fila dinámicamente, eso significa que los eventos no se agregan cuando se carga el dom, puede modificar este comportamiento usando un selector principal que ya existe cuando se procesa el dom, también agregue algunas referencias usando atributos de datos entre entradas y seleccione hacer más fácil manejar esto
Intenta usar el siguiente código
$(".parent-class").on("change",".checkbox-class", function() { var enabledDropdown = $(this).data("dropdown") $(`#${enabledDropdown}`).removeAttr("disabled") }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table class="parent-class"> <tr> <td> <input asp-for="Id" class="form-control" /> </td> <td> <input data-dropdown="MyDropDownId1" asp-for="EnableDropDown1" id="EnableDropDown1Id" type="checkbox" class="form-control checkbox-class" /> </td> <td> <select asp-for="MyDropDown1" id="MyDropDownId1" asp-items="Html.GetEnumSelectList<MyEnum1Type>()" disabled="disabled" class="form-control"></select> </td> <td> <input data-dropdown="MyDropDownId2" asp-for="EnableDropDown2" id="EnableDropDown2Id" type="checkbox" class="form-control checkbox-class" /> </td> <td> <select asp-for="MyDropDown2" id="MyDropDownId2" asp-items="Html.GetEnumSelectList<MyEnum2Type>()" disabled="disabled" class="form-control"></select> </td> </tr> </table>