Question

I have following Javascript code that creates a button element that has a click event.

function Button(id, url, blockMsg){

var id = id;
var url = url;
var blockMsg = blockMsg;
var message;

this.getId = function(){
    return id;
};

this.getMessage = function(){
    return message;
};

block = function(msg){
    $.blockUI({
        message: msg
    });
};

unblock = function(){
    $.unblockUI();
};

showErrors = function(){
    console.log('errors');
}

$(id).bind('click', function(){
    $.ajax({
        url: url,
        type: 'POST',
        beforeSend: function(){
            block(blockMsg);
        },
        error: function(response){
            message = $.parseJSON(response);
            message.action();
            unblock();
            console.log(action);
        },
        success: function(response){
            message = $.parseJSON(response);
            [message.action]();
            unblock();
            console.log(action);
        }
    });
});
};

$(document).ready(function(){
var buttonRegister = new Button('#btnCompanyRegister', '/company/register/', 'register ...');
});

When I click on the button everything works fine and my PHP script returns

json_encode(array('action' => 'showErrors'));

In FireBug I can see the error: [“showErrors”] is not a function

What am I doing wrong? Why is there no function specified? Do I have a scope problem?

Thank you for your help.

Answer 1

Instead of [message.action](); use window[message.action]();.

message.action is the string “showErrors” – which is not a function. You can get the global function showErrors from the window object.