Call function on submit of ajax form

Question

I'm using the ajaxForm.js to make an ajax image upload.

this is the js function I use:

$(document).ready(function() {
    $('#photoimg').live('change', function() {
        $("#hd_pic").html('');
        $("#loading").html('<img src="../img/common/loader.gif"/>').fadeIn(250);
        $("#imageform").ajaxForm({
            target: '#hd_pic'  
        }).submit();
    });
});

I don't want to output the result to target: '#hd_pic', but I want to call a function. For example, I do it this way in my ajax call:

$.ajax({
    type: "POST",
    url: "/ajax/add_url.php",
    data: dataString,
}).done(function(result) {
    myresult(result);
});​

I call the function myresult and I use the result of the ajax call. I also want to do this in the ajaxform submit function. Is it possible to do this?

This doesn't work:

        $("#imageform").ajaxForm({
        success: myresult(result)
    }).submit();

Answer 1

Instead of target , you can use a success callback property as one of the options :

$("#imageForm").ajaxForm({
    success: function() {
        // your callback code goes here
    }
});

Answer 2

I think you can do:

$("#imageform").ajaxForm({
    success: myresult
}).submit();

Answer 3

exact syntax you want

 $("#imageform").ajaxForm({
        target: '#hd_pic',
        success: function(){/*your code after here*/}
    })

jQuery API: Ajax Options