Javascript scope issue, ajax

Question

I want to submit a form using ajax, then add a "disabled" class if the ajax request succeeds.

$("body").on("click", ".my_form", function(e){
    submit_form(e, $(this));    
});

function submit_form(e, _this){
    e.preventDefault();
    $.ajax({
        type:"POST",
        url:"/controller/common/form_processing.php", 
        data: "my form data goes here",
        dataType: "json", 
        success:function (data, _this) {
            _this.parents(".my_form").addClass("disabled");
       });
});

In it's current form, the "disabled" class is not being added. However, if I move the line: _this.parents(".thumbsup").addClass("disabled"); outside of the ajax brackets, it does work. (but obviously in this case, "disabled" will be added regardless of whether the ajax call succeeds or fails. Can somebody explain how to get this working properly? Thanks

Musa · Accepted Answer · 2013-03-25 19:13:46Z

1

Remove the _this parameter from your success callback, you are redefining _this over the original one which is the jQuery object passed to submit_form

success:function (data) {
    _this.parents(".my_form").addClass("disabled");
});

answered Mar 25, 2013 at 19:13

Musa

97.9k17 gold badges123 silver badges144 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Javascript scope issue, ajax

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related