Question

I found Malsup’s JQuery Form plugin quite handy in ajaxyfying my forms. However I am unable to refer to the target element on which the submit event occured in success and error callbacks. The this keyword in the refers to the ajaxForm object and not the DOM element.

I have lots of small forms on my page. Like accept and reject buttons against requests and I want to submit those forms using ajax. When it gets completed I want to remove that form from DOM and display a message “Request Successful!” or so. But I am unable to locate the target which actually submitted the form.

I know I can pass a context option which will be the context of all callbacks, in that too I am unable to make out how to refer to the element on which the submit event occured?

Thanks in advance.

Answer 1

Got it.

I can pass a beforeSubmit function in which I set the context to the target.

$('form').ajaxForm({
    beforeSubmit: function(arr, $form, options){
        options.context = $form;
    }
    //Rest of the options and callbacks
});