Pass javascript variable to AJAX success function

Question

I have a page with 1-N tables of courses, and I'm trying to get my ajax function to update the table that called it, and not every table, or just one.

$(document).on('click',".addCourse",function(e){
    var courseTable = $('#courseList1');
    HideDialog();
    $.ajax({
        type:'POST',
        data:'{}', 
        url:'/degreebuilder/degree/createCourse',
        success:function(data,textStatus,courseTable){
            $(courseTable).html(data);
            },
        error:function(XMLHttpRequest,textStatus,errorThrown){}
    });

});

How do I pass the success function the var courseTable?

This isn't a duplicate to what was linked. This is asking how to use a variable for the success function when updating a DOM element. I have 1, possibly N tables of data, each table can call this POST function, and I need it to update the table that called it.

This works just fine. Spelling helps a ton when you are referencing DOM elements.

since courseTable is declared outside ajax call, it can be accessed from success — Rajesh, Oct 01 '13 at 19:29
When I use the variable, nothing happens. No errors, no update, just nothing. If I hard code one of the table id's in such as `$('#courseTable2').html(data);` it works just fine. — idonaldson, Oct 01 '13 at 19:31
The variable `courseTable` doesn't relate to anything in the DOM, in your code above. Does it, in real use? — Reinstate Monica Cellio, Oct 01 '13 at 19:32
@Archer Yes, it relates to the current table that the user is working on. — idonaldson, Oct 01 '13 at 19:34
It would be a DOM element, so I would need to change from $(courseTable) to ? — idonaldson, Oct 01 '13 at 19:37
No that's fine - wrap it in `$()` so that you can use jQuery methods. Ah - I see you've edited your question. courseTable is now a parameter of the success function - it shouldn't be. Just remove the 2nd and 3rd parameters and put `console.log(data)` to make sure you're getting a response you'd expect, and it should work if that's fine. — Reinstate Monica Cellio, Oct 01 '13 at 19:39

score 3 · Answer 1 · answered Oct 01 '13 at 19:34

If the courseTable variable is in scope when you call $.ajax, it will also be in scope when the success callback is hit. Alternatively, you could do:

var courseTable = ();
$.ajax({
    //...
    success: $.proxy(function (table) {
        //table is a reference to courseTable
    }, null, courseTable)
});

Pass javascript variable to AJAX success function

1 Answers1