How to dynamically pass the input name to Jquery

Question

I have the following function in jquery in my script PHP

$('.myinput').on('blur', function(e) {
    $.ajax({
        url: 'gravadado.php',
        method: 'POST', // ou POST
        data: {
            q10600: this.value
        },
        success: function(resposta) {
            var div = document.querySelector('#divDestino');
            div.innerHTML = resposta;
        }
    });
});

I have several inputs with the same class (.myinput) but in my jquery where I pass the name statically I want to pass the name of the input that called the event.

I mean, if it was input with name q10630 that triggered the event Onblur of Jquery I want to pass on my function Jquery the name q10630 but if it is the name of the input q10700 that triggered the event I will pass this name 'q10700'. I don’t know if it got too confusing. I also don’t know if it’s possible to do it that way.

Or if I have to give a class name for each input I have and create an event for each of these classes Onblur separately?!? Because I have really many inputs in my code HTML. Then it would be hundreds of events onblur if you have to reference each Input with a different class name. Understand?

Answer 1

Creates a object and passes keys with the value you want in this case the input name , and in the ajax raisins the object whole;

$('.myinput').on('blur', function(e) {

    var name = $(this).attr('name');
    var data = {};
    data[name] = $(this).attr('value');

    $.ajax({
        url: 'gravadado.php',
        method: 'POST', // ou POST
        data: data,
        success: function(resposta) {
            var div = document.querySelector('#divDestino');
            div.innerHTML = resposta;
        }
    });
});