Does anyone know how to create columns dynamically and include a render function in the array?

GlueData Accounts

So far, I have tried this :

var init = function(){
var getData = $.ajax({
url:"./php/get/getTableData.php", //the page containing php script
method: "POST", //request type
data: {'tblName' : $scope.tblName},
success:function(result){
$scope.data = JSON.parse(result);
$scope.columnBuilder($scope.data);
}
});
};
init();

    $scope.columnBuilder = function(data){

        var editor;

        $scope.i = 0;
            for (var obj in data) {
                var len = Object.keys(data[obj]);
                if($scope.i, $scope.i < 1, $scope.i++){
                    for(var row in len){
                        if(len[row].substr(0, 6) == "LEGACY"){
                           $scope.columns.push(
                               {"data": len[row],                       
                                "render": function ( data, type, full, meta ) {
                                    var half = data.replace('<', '(');           
                                    var last_bit = half.replace('>', ')');       

                                    return last_bit;                             
                                }}
                            )
                            console.log($scope.columns);
                        }
                        $scope.columns.push({"data" : len[row]});
                    }
                };  
            }

It worked when the render was not needed, but now that I have tried too insert a render function it does not work anymore -
Cannot read property 'style' of undefined is the current error.

GlueData Accounts

Solved