Siavosh
Siavosh

Reputation: 2354

Change view after make ajax call AngularJS

I am developing a single page application, with help of AngularJS and I'm new to it maybe my question is so primitive but at the moment I don't know how to handle it

what I need to do id to open up a pop-up menu after user enters his/her username and password then make a ajax call to Server and if the user is authenticated another view(profile) is displayed.

This is my ajax call

   formApp.controller('mainController',function FormCtrl($scope,$http){                                    

           $scope.processForm = function() {
               $http({
                   method  : 'POST',
                   url     : 'login',
                   data    : $.param($scope.formData), 
                   headers : { 'Content-Type': 'application/x-www-form-urlencoded'} 
              }).success(function(data){
                        console.log(data);                                                     
                    });

                };

And this is the routers and views config :

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

            formApp.config(function($routeProvider) {
                    $routeProvider
        .when('/', {
            templateUrl : 'main',
            controller  : 'mainController'
        })

        .when('/profile', {
            templateUrl : 'profile',
            controller  : 'profileController'
        })

            });

Thanks in advance,

Upvotes: 1

Views: 1163

Answers (2)

user680786
user680786

Reputation:

So now in success method call route-change: return $location.path('/profile');

Also, I guess, you need some service where you will keep user's data.
Also, consider to use ngResource (or similar things) to work with REST backend (and don't keep this logic in controller).

Upvotes: 3

Shivaraj
Shivaraj

Reputation: 613

Use modal window and inject controller into it and in resolve make the service call which contains your $http request.

see the link for modal window.

Angular-UI

Upvotes: 0

Related Questions