I have the following very simple code:
$('#filtro-atenciones').on('change', () => {
console.log("Entra!!");
console.log(this.value);
console.log($(this).val());
});
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<div id="div-filtros" class="form-group">
<label for="filtro-atenciones">Atenciones:</label>
<select class="form-control" id="filtro-atenciones">
<option value="total" selected>Total</option>
<option value="pendientes">Pendientes</option>
<option value="curso">En curso</option>
</select>
</div>
As you can see, $(this)
it returns undefined, I don't know why. If someone could give me a hand I would be more than grateful.
According to the documentation on the use of this in arrow functions:
Which in short means that you don't bind to the scope of a function when you use
=>
, if you want to access the scope, you'll have to use a standard function expression:It is good to note that even if you force the context to an arrow function, it will not take it into account: