$http is not a function error in ag-grid

Question

I am using Angular Grid (ag-grid) to display data. In my table, whenever user adds a comment by inline editing, i intend to make a rest call and save comment in DB. I have put $http thing to make rest call in newValueHandler. In debugger i see that newValueHandler is invokded but $http is undefined. And then i get the error: Uncaught TypeError: $http is not a function

function CompletedActionsCtrl($scope, $http) {
    var columnDefs = [{
        headerName: "Comments",
        field: "comments",
        width: 180,
        filter: 'text',
        editable: true,
        newValueHandler:addCommentHandler,
        valueGetter: function (params) {
            if (params.data.comments != null) {
                return params.data.comments[0];
            }
        }
    }]


function addCommentHandler(params,$http){
    var url = "./postComment";
    $http({method: 'GET',url: url
  }).then(function successCallback(response) {}, function errorCallback(response) {});}


//==Controller invoker==
var app = angular.module('app', ['ngRoute', 'agGrid']);
app.config(['$routeProvider', function ($routeProvider) {
$routeProvider.when('/completed_actions', {
        templateUrl: 'completed_actions_partial.html',
        controller: CompletedActionsCtrl
    });
}]);

Seems to be a trivial task, and i am sure i am missing something basic.

P.S. New to Javascript and angularjs.

== Code Flow Explanation == When user hits completed actions tab, CompletedActionsCtrl is invoked by routing. Inside this controller, a grid is prepared and rendered. Now when user edits the comment, and submits it, newValueHandler is invoked which is function addCommentHandler

== Update == Got it working by instead of calling a private function as handler, defined an anonymous function.

So removed this ->

newValueHandler:addCommentHandler,

And Added this ->

newValueHandler:function(params){
                var url = "./postComment";
                $http({method: 'GET',url: url})
                    .then(function successCallback(response) {},
                        function errorCallback(response) {});},

But the problem is that i need to have this handler at many places, and this approach will cause lot of code duplication. Any better ideas?

Where is the controller code, from where you call that function? — michelem
– michelem, Commented Nov 9, 2015 at 7:44
did you tried this to pass those as the parameters? controller: ["$scope", "$http", CompletedActionsCtrl($scope, $http)] — hsynlms
– hsynlms, Commented Nov 9, 2015 at 12:44
follow this link might be helpful for you, it passes apitoken argument to another one : docs.angularjs.org/guide/providers#service-recipe — hsynlms
– hsynlms, Commented Nov 17, 2015 at 14:28

Pankaj Parkar · Accepted Answer · 2015-11-09 07:45:47Z

1

Remove $http from your function, the parameter which you have added on your addCommentHandler function is vanishing the existence $http service.

Code

function addCommentHandler(params){ //<-- removed $http paramter function.
    var url = "./postComment";
    $http({method: 'GET',url: url
  })
  .then(function successCallback(response) {}, 
     function errorCallback(response) {});
}

answered Nov 9, 2015 at 7:45

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

rajya vardhan Over a year ago

Thanks. But i am still getting the error. Uncaught ReferenceError: $http is not defined

macrog · Accepted Answer · 2015-11-09 07:47:53Z

1

Remove $http from method declaration, you are trying to inject a angular service to a private method!

answered Nov 9, 2015 at 7:47

macrog

2,0951 gold badge23 silver badges30 bronze badges

6 Comments

rajya vardhan Over a year ago

Thanks. But i am still getting the error. Uncaught ReferenceError: $http is not defined

macrog Over a year ago

to use $http angularjs service you need to inject it into controller under this method is used, show me you controller code please ?

rajya vardhan Over a year ago

Thanks! Added it in the Qs. plz see the code under //==Controller invoker== and Code Flow Explanation.

macrog Over a year ago

I think your issue here is the way you did your controller, CompletedActionsCtrl have no idea what $http is, check plz this answer how to declare a controller, then in [] of controller you can inject a angularjs services like $http and use them in your function.

rajya vardhan Over a year ago

But i am injecting $http in CompletedActionsCtrl. Also, if i use $http inside this controller then also it works fine. Problem is i can't use $http inside a private function(addCommentHandler in this case) called from CompletedActionsCtrl.

|

Collectives™ on Stack Overflow

$http is not a function error in ag-grid

2 Answers 2

1 Comment

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related