Not able to redirect to home page after login in ionic framework

// Ionic Starter App

// angular.module is a global place for creating, registering and retrieving Angular modules
// ‘starter’ is the name of this angular module example (also set in a attribute in index.html)
// the 2nd parameter is an array of ‘requires’

angular.module(‘fffff’, [‘ionic’, ‘chart.js’, ‘ui.router’])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if(window.cordova && window.cordova.plugins.Keyboard) {
if(window.StatusBar) {

//Multiple Controllers Approach Start
.config(function ($stateProvider, $urlRouterProvider) {

  // Ionic uses AngularUI Router which uses the concept of states
  // Learn more here:
  // Set up the various states which the app can be in.
  // Each state's controller can be found in controllers.js
  //LoginCtrl HomeCtrl

    .state('login', {
            url: '/',
	templateUrl: 'index.html',		
	controller: 'loginCtrl'
  //<p>Hello, world!</p>
    .state('fhcentral', {
            url: '/fhcentral',
	templateUrl: 'fh_central.html',	
	controller: 'fhCtrl'

  // if none of the above states are matched, use this as the fallback


//Multiple Controllers Approach End
.controller(‘loginCtrl’, function($scope, $location, $ionicSideMenuDelegate, $http, $stateParams, $state) {

$scope.errMsg = “”;
$scope.response = “”;
$scope.login = function () {
if(!$scope.uname) {
$scope.errMsg = “Please enter your username !”;

    if(!$scope.pwd) {
        $scope.errMsg = "Please enter your password !"; 
    if(!$scope.uname && !$scope.pwd) {
        $scope.errMsg = "Please enter your username and password !"; 
    // Here Need the Validation        
    if($scope.uname && $scope.pwd) 
     $http.get('', {
                params: {
                    userId: '123456',
                    authCode: "123456",
                    emailId: $scope.uname,
                    password: $scope.pwd
        .success(function (data,status) { 
           //User does not exist
           var response = angular.toJson(data);
           var response = JSON.parse(response);
           if(response.LoginDetail[0].message == "User does not exist") {
               $scope.errMsg = "User does not exist !"; 
           if(response.LoginDetail[0].message == "Password Incorrect") {
               $scope.errMsg = "Password Incorrect !"; 
           if(response.LoginDetail[0].message == "Password Matched") {   
	   //$scope.errMsg = "Password Matched !"; 	                
               window.localStorage['username'] = $scope.uname; 
               window.localStorage['pwd'] = $scope.pwd;               
               window.localStorage['pgmId'] = response.LoginDetail[0].pgmId;
               window.localStorage['email'] = response.LoginDetail[0].email;
               window.localStorage['userId'] = response.LoginDetail[0].userId;
               window.localStorage['roleCode'] = response.LoginDetail[0].roleCode;
               window.localStorage['roleId'] = response.LoginDetail[0].roleId;
               window.localStorage['accId'] = response.LoginDetail[0].accId;
               window.localStorage['userType'] = response.LoginDetail[0].userType;
               //$scope.succMsg == "Welcome to Home Page"; 
           //User does not exist
           //return false;
           //var message = response.LoginDetail[0].message; 


.controller(‘fhCtrl’, function($scope, $ionicSideMenuDelegate, $http, $stateParams, $state) {

In the above app.js code … the $state.go(‘fhcentral’); piece of code is not working … I am not able to redirect to the relevant fh_central.html page successfully …

May I know what is the reason ?

Do you get the “Hi” alert? Any errors in the console?
Add Semicolons behind the $stateProvider.state(…);
Check if the templateUrl is correct?
Does the URL change to /fhcentral if you try it in a browser?

Yes to all the questions you have asked …

I am getting the Hi alert
I have added semicolons now … but still it doesnt work …
Template URL is correct
URL change to /fhcentral when tried in a browser

Any solutions other than the above ??

How does your index.html look like? Do you have a view element in it?

<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">

<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/" rel="stylesheet">

<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>

<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>

<!-- your app's js -->
<script src="js/Chart.js"></script>
<script src="js/angular-chart.js"></script>
<script src="js/app.js"></script>


{{ errMsg }} {{ }}


The above is my index.html page code …


{{ errMsg }} {{ }}


It’s not showing up properly. :wink:

Yes … pls wait for 2 min … I will post it properly …

1 Like

Oh I think you might have misunderstood me… I just wanted to see the html, not what it looks like in browser. Sorry.
Try adding a <ion-nav-view> to your index.html if you don’t have one. This is where your templates get injected.

You there … vikSwapd ?

1 Like

I am not able to post any tag as text … in my reply … Hw to post the html tags as the text in the reply … ?

Just mark it as code. If that does not working for some reason put <!-- in front of your html and --> behind it.

Please find the below screenshot of my index.html page code… I am not using the … Any solution now ??

You have to put everything that’s in your body right now inside a new file login.html.

Your index.html should look more like this:


and then your login view and fhcentral view get automaticly injected inside the <ion-nav-view>.
You should take a look at this:

Wait … we are implementing what you suggested … Will get back to you … shortly …

Thank you very much vikSwapd … It worked finally for us … Have a great day … enjoy …

1 Like

Hi vikSwapd … u there … ? I have one more doubt to be cleared from your end … ?

NOw the issue I am facing is … When I include any form elements inside the <–ion-side-menus–> <–ion-side-menu-content --><–ion-content–>Form comes here ie; for example, <–input id=“searchKey” type=“search” placeholder=“Search” ng-model=“shopsearchKey” autocorrect=“off” value = “{{ shopsearchKey }}” --> then the $scope.shopsearchKey value I am not able to retrieve it </–ion-content–></–ion-side-menus–>

Any Suggestions ?

do you have your controller assigned correctly?