Sé que hay toneladas de preguntas sobre este tema y he intentado muchas de ellas sin éxito. Si alguien tiene alguna sugerencia, sería muy apreciada. Estoy tratando de obtener el atributo de identificación de las entradas. He eliminado el código para centrarme solo en el problema.
El cshtml:
@for (var i = 0; i < Model.DieRouteChecks.Count; i++) { <div class="col-9"> <div class="form-group newThresholdInput"> <input asp-for="@Model.DieRouteChecks[i].NewDieThresh" class="form-control" id="@Model.DieRouteChecks[i].Description"> </div> </div> }Mi javascript:
$(".newThresholdInput input").click(() => { console.log($(this).attr("id")); //To see what's being returned switch ($(this).attr('id')) { case "Order Value": //Do stuff break; case "Order Quantity": //Do stuff break; } }) Sigo obteniendo undefined registrado al hacer clic en la entrada. He intentado
$(".newThresholdInput").click(() => { console.log($(this).find("input").attr("id")); } E imprimió solo la identificación del primer elemento de entrada. También intenté usar onclick="function(this)" y crear un controlador de eventos que se llama en las etiquetas del script, pero aún nada.
Lo divertido es console.log($(".newThresholdInput input").attr("id")) registra el Order Value como debería, así que supongo que tiene algo que ver con la forma en que estoy usando $(this) .
Estoy seguro de que me estoy perdiendo algo pequeño, pero no sé qué podría ser.
En su evento de clic, this representa toda la ventana para que no pueda encontrar el elemento en el que hizo clic.
Cambia tu js a:
@for (var i = 0; i < Model.DieRouteChecks.Count; i++) { <div class="col-9"> <div class="form-group newThresholdInput"> <input asp-for="@Model.DieRouteChecks[i].NewDieThresh" class="form-control" id="@Model.DieRouteChecks[i].Description"> </div> </div> } @section Scripts { <script> $(document).on('click', '.newThresholdInput input', function () { var index = $(this).attr("id"); console.log(index); }); </script> }