Question

I think this is quite simple. I have a working AJAX Jquery script which posts data to another page. I want to add a preloader to the division containing the input, each of which has a class name with an id in it.

I need to know how to use the post data within the beforeSend function.

$('#stock_ctrl input').change(function() {

        $.ajax({
            type: "POST",
            data:   {   stock: this.value, 
                        id: this.name
                    },
            url: "example.php",

            beforeSend: function(data) {

                $('.updating'+data.id).html("Preloader here.");

               // I have tried data.id, this.name, $(this).attr.("name");

            success: function(){
                // success (this works fine)
            }
        });

    });

See my comment in th code, this is where I want to use the name data that came from the original input and this is what I’m stuck on. Any help much appreciated.

Answer 1

when the anonymous function of beforeSend is executing, you switch context, so the this doesn’t refer to the same object anymore.
You need to give the this you want to the function

$('#stock_ctrl input').change(function() {

    $.ajax({
        type: "POST",
        data:   {   stock: this.value, 
                    id: this.name
                },
        url: "example.php",

        beforeSend: $.proxy(function(data) {

           // this should now refer to the correct object and you can perform your operations
        }, this),
        success: function(){
            // success (this works fine)
        }
    });

});

just typed but should work