Question

Possible Duplicate:
javascript object, access variable property name?

I’m trying to call a method of an object by its name when certain event happens – here’s my code:

var imageObject = {
    sendImage : function(obj) {
        "use strict";
        var thisId = obj.attr('id');
        var thisSubmit = obj.attr('data-submit');
        var thisCallback = obj.attr('data-callback');
        var thisUrl = $('#' + obj.attr('data-url')).text();
        new AjaxUpload(thisId, {
            action: thisUrl,
            name: 'thisfile',
            onSubmit: imageObject.thisSubmit,
            onComplete: imageObject.thisCallback
        });
    }
}

I would also like to pass the parameters to the submit and callback method.

At the moment nothing happens and I’m sure I’m not calling it right – could anyone explain how to achieve this?

I’ve also used the following for submit and complete :

onSubmit: function(file, extension) {
    imageObject.thisSubmit(file, extension);
},
onComplete: function(file, response) {
    imageObject.thisCallback(file, response);
}

But what I get is the error saying :

imageObject.thisSubmit is not a function

The attributes only store the name (string) of the method within the object – so it would be for instance ‘uploadImage’.

Answer 1

TJ’s answer is nearly there, except that (per the new code in your question) you need to either copy the arguments from onSubmit to thisSubmit, or use .apply() to copy them for you.

The code below uses the latter method, which avoids having to duplicate the function signature over and over:

new AjaxUpload(thisId, {
    action: thisUrl,
    name: 'thisfile',
    onSubmit: function() {
        imageObject[thisSubmit].apply(imageObject, arguments);
    },
    onComplete: function() {
        imageObject[thisCallback].apply(imageObject, arguments);
    }
});