StudioTime
StudioTime

Reputation: 23959

Passing post variables through ajax

I have a link:

<a class="tag" wi_id="3042" wl_id="3693" for_user_id="441" href="#a">

which triggers an ajax call

$(".tag").click(function() {
        var for_user_id = $(this).attr("for_user_id");
        var wl_id = $(this).attr("wl_id");
        var wi_id = $(this).attr("wi_id");
        $.ajax({
            type: "POST",
            url: "/ajax/actions/tag.php",
            data: { 
                'for_user_id': 'for_user_id', 
                'wl_id': 'wl_id',
                'wi_id': 'wi_id'
            },
            success: function(data){
                $(this).text("You've tagged this");
                $(this).closest('.gl_buttons_holder').toggleClass('gl_buttons_holder gl_buttons_holder_tagged');
                $(this).closest('.gl_buttons').addClass('tagged');
            }
        });
        return false;
    });

But in the console I see the following:

TypeError: e is undefined

The ajax file gets processed but the POST data is blank, and the success actions do not happen, so it gets posted with zeros and classes are not changed

I have stared and stared... anything obvious?

Upvotes: 0

Views: 101

Answers (2)

Barmar
Barmar

Reputation: 780688

this is not passed automatically to the AJAX callback function. You can use the context: parameter to tell jQuery to pass it:

    $.ajax({
        type: "POST",
        url: "/ajax/actions/tag.php",
        data: { 
            'for_user_id': for_user_id, 
            'wl_id': wl_id,
            'wi_id': wi_id
        },
        context: this,
        success: function(data){
            $(this).text("You've tagged this");
            $(this).closest('.gl_buttons_holder').toggleClass('gl_buttons_holder gl_buttons_holder_tagged');
            $(this).closest('.gl_buttons').addClass('tagged');
        }
    });

Upvotes: 4

mehmetseckin
mehmetseckin

Reputation: 3107

You're sending your data wrong, don't call your variables inside single quotes.

$(".tag").click(function() {
        var for_user_id = $(this).attr("for_user_id");
        var wl_id = $(this).attr("wl_id");
        var wi_id = $(this).attr("wi_id");
        $.ajax({
            type: "POST",
            url: "/ajax/actions/tag.php",
            data: { 
                'for_user_id': for_user_id, 
                'wl_id': wl_id,
                'wi_id': wi_id
            },
            success: function(data){
                $(this).text("You've tagged this");
                $(this).closest('.gl_buttons_holder').toggleClass('gl_buttons_holder gl_buttons_holder_tagged');
                $(this).closest('.gl_buttons').addClass('tagged');
            }
        });
        return false;
    });

Upvotes: 0

Related Questions