Success Callback not called when $http post is in method scope

Question

I am trying to achieve a login functionality using Angular JS on front-end and PHP + Zend on the back-end. Below is the code snippet of the angular js controller. This doesn't redirect the user to the appropriate page and while debugging, the control doesn't enter the success part but enters the error part with data being NULL. However if I put the $http part outside the function, atleast the control enters the success part with data being that of the next page to be redirected.

What could i be missing and what is the correct way to achieve the redirection?

In the below code the control doesn't enter the success section.

    var myApp = angular.module('myApp',[]);

    myApp.controller('loginCtrl', function ($scope, $http) {

        $scope.authenticatelogin = function () {
        $http({
            url: "/admin/auth/authenticatelogin",
                method: "POST",
                headers: {'Content-Type': 'application/x-www-form-urlencoded'},
                data: $.param({login: $scope.login, password: $scope.password, rememberMe: $scope.remember})
            }).success(function(data, status, headers, config) {
                $window.location.href= "index/index";
                $scope.data = data;
            }).error(function(data, status, headers, config) {
                $scope.status = status;
            });
        };
    });

In the below code the control enters the success section.

var myApp = angular.module('myApp',[]);

myApp.controller('loginCtrl', function ($scope, $http) {

        $http({
            url: "/admin/auth/authenticatelogin",
                method: "POST",
                headers: {'Content-Type': 'application/x-www-form-urlencoded'},
                data: $.param({login: 'abc@abc.com', password: 'xyzxyz', rememberMe: ''})
            }).success(function(data, status, headers, config) {
              $window.location.href= "index/index";
                $scope.data = data;
            }).error(function(data, status, headers, config) {
                $scope.status = status;
        });
});

Could you provide the code that invokes your authenticatelogin method. Also, are you using the zend dispatching/routing to handle navigation in your application? — skubski, Aug 17 '15 at 07:45
What do you mean by "put the $http part outside the function"? — Gildor, Aug 17 '15 at 08:42
I have modified the question, please check the same. Yes the backend is using the zend dispatching/routing to handle the navigation. — Sudhanva Kotabagi, Aug 17 '15 at 09:07

score 0 · Accepted Answer · answered Aug 17 '15 at 07:26

I would rather go for success/error callbacks to be part of the then method. From angular documentation for version 1.4.5:

The $http legacy promise methods success and error have been deprecated. Use the standard then method instead. If $httpProvider.useLegacyPromiseExtensions is set to false then these methods will throw $http/legacy error.

Try this one, although if you say that your code works outside the closure, it might not be the solution you are looking for:

$http({
    url: "/admin/auth/authenticatelogin",
    method: "POST",
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    data: $.param({login: $scope.login, password: $scope.password, rememberMe: $scope.remember})
}).then(function(data, status, headers, config) {
    $window.location.href= "index/index";
    $scope.data = data;
}, function(data, status, headers, config) {
    $scope.status = status;
});

Success Callback not called when $http post is in method scope

1 Answers1

Linked