Can not call one function from another function using angular.js

Question

i was trying to call one function from another function using angular.js but it gave the following error.

TypeError: $scope.addwithDept is not a function

I am explaining my code below.

Rolecontroller.js:

var dashboard = angular.module('Channabasavashwara');
dashboard.controller('roleController', function ($scope, $http, $state) {
    $scope.buttonName = "Add";
    $scope.addUserRoleData = function () {
        if ($('#addProfileData')[0].defaultValue == 'Add') {
            if ($scope.showDept) {
                $scope.addwithDept();
            } else {
                $scope.addwithOutDept();
            }
        }
    }
    $scope.addWithDept = function () {
        console.log('hii');
    }
})

The error is coming at function inside the if statement.Please help me to resolve this error.

It probably has to do with the way you're attaching controller to DOM, here's a simplified version if you want to play with it — maioman
– maioman, Commented Oct 10, 2015 at 10:36
See Updated Fiddle, by moving the function up has solved problem, Thanks @Rajesh for fiddle. — Tushar
– Tushar, Commented Oct 10, 2015 at 10:38

Tushar · Accepted Answer · 2015-10-10 09:52:48Z

1

Move the function scope.addWithDept above the functions which are calling it.

The function when defined as $scope.functionName = function() {... is the function expression. The function is not yet defined, so calling it results in fn is not a function error. This function is not like function declaration. Function declaration is hoisted to the top whereas function expressions are not.

var dashboard = angular.module('Channabasavashwara');
dashboard.controller('roleController', function ($scope, $http, $state) {

    $scope.buttonName = "Add";

    // Moved this function here
    $scope.addWithDept = function () {
        console.log('hii');
    };

    $scope.addUserRoleData = function () {
        if ($('#addProfileData')[0].defaultValue == 'Add') {
            if ($scope.showDept) {
                $scope.addwithDept();
            } else {
                $scope.addwithOutDept();
            }
        }
    };
});

edited Oct 10, 2015 at 9:52

answered Oct 10, 2015 at 9:48

Tushar

87.4k21 gold badges164 silver badges182 bronze badges

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

1 Comment

Tushar Over a year ago

@satya Can you please create jsfiddle and also add HTML in question

Gaurav Sachan · Accepted Answer · 2015-10-10 10:59:38Z

0

you need to declare $scope.addWithDept function before $scope.addUserRoleData function

var dashboard = angular.module('Channabasavashwara');
dashboard.controller('roleController', function ($scope, $http, $state) {
    $scope.buttonName = "Add";

    $scope.addWithDept = function () {
        console.log('hii');
    }
    $scope.addUserRoleData = function () {
        if ($('#addProfileData')[0].defaultValue == 'Add') {
            if ($scope.showDept) {
                $scope.addwithDept();
            } else {
                $scope.addwithOutDept();
            }
        }
    }
})

Let me know if this does not work.

answered Oct 10, 2015 at 10:59

Gaurav Sachan

3201 silver badge10 bronze badges

3 Comments

Tushar Over a year ago

This is exact duplicate of my answer stackoverflow.com/a/33052614/2025923, didn't you see that, I've posted it about 45 minutes ago

Gaurav Sachan Over a year ago

oh sorry, i didn't see that.

satya Over a year ago

Thanks to all for sharing their solution.But mistake was in my side.I found it and corrected it.Please see the two function name.it is total different thats why the error was coming.

Collectives™ on Stack Overflow

Can not call one function from another function using angular.js

2 Answers 2

1 Comment

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related