angular-Js: not able to access array elements in different function call within same controller

Question

I just need to store data in $scope.user on register() call, and trying to login using its data elements.. But not successful. I've used simplest way, I think, there may be other ways(like localStorage, cookies etc.) Im new to angular, don't know how to implement them. Please help me out...

Controller :

var app = angular.module("app",[]);     
    app.controller("ctr",function($scope){    

         $scope.user = [{
                        fname:"",
                        lname: "",
                        username: "",
                        password: ""
                        }];  

          $scope.register = function(userData){
              $scope.user.push(userData);
              alert($scope.user.username); *//show undefined*       
           };

          $scope.login = function(loginData){
             if(loginData.username == $scope.user.username) {
               alert("Login successfully!!");
              }
              else alert("Wrong user!");
           };
        });

View :

<body ng-app="app">
    <div ng-controller="ctr">       
        <table >
             <tr>
                 <td><label>Username : </label></td>
                 <td><input type="text" ng-model="loginData.username" placeholder="Name" /></td>                 
             </tr>
             <tr>
                 <td><label>Password : </label></td>
                 <td><input type="password" ng-model="loginData.password" placeholder="Password" /></td>                 
            </tr>
            <tr>                
                <td colspan="2">
                    <input type="button" value="Login" ng-click="login(loginData)" class="save"/>
                </td>               
            </tr>
        </table>

        <table >
            <tr>
                 <td><label>First Name : </label></td>
                 <td><input type="text" ng-model="userData.fname" placeholder="First Name" /></td>               
             </tr>
             <tr>
                 <td><label>Last Name : </label></td>
                 <td><input type="text" ng-model="userData.lname" placeholder="Last Name" /></td>                
            </tr>
             <tr>
                 <td><label>Username : </label></td>
                 <td><input type="text" ng-model="userData.username" placeholder="Name" /></td>              
             </tr>
             <tr>
                 <td><label>Password : </label></td>
                 <td><input type="password" ng-model="userData.password" placeholder="Password" /></td>              
            </tr>
            <tr>                
                <td colspan="2"><input type="button" value="Register" ng-click="register(userData)" class="save"/></td>                 
            </tr>               
        </table>        
    </div>    
</body>

Would really appreciate if someone could help me out with this problem.

devqon · Accepted Answer · 2015-09-21 13:02:18Z

2

You push the userdata to an array, your $scope.user is an array, not an object. Try this instead:

$scope.user = {};  

$scope.register = function(userData){
    $scope.user = userData;
    alert($scope.user.username);
};

answered Sep 21, 2015 at 13:02

devqon

14k2 gold badges32 silver badges46 bronze badges

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

Comments

Magus · Accepted Answer · 2015-09-21 13:03:34Z

0

Since the variable $scope.user is an array, you should use something like this :

alert($scope.user[0].username)

answered Sep 21, 2015 at 13:03

Magus

15.1k4 gold badges40 silver badges52 bronze badges

Comments

Sim · Accepted Answer · 2015-09-21 13:09:31Z

Your if statement is false:

if(loginData.username == $scope.user.username) {

your $scope.user is an array and you should search first for the object with this username, before you can compare the password.

$scope.login = function(loginData){
             //Filter your user array and find the user with given username
             var user = $filter('filter')($scope.user, function (u) {return u.username === loginData.username;})[0];
             //Compare login data
             if (user == null) {
                alert("User not found");
             } else {
                if(user.password == loginData.password) {
                   alert("User logged in");
                } else {
                   alert("Wrong Password");
                }
             }
};

I've got no possibility to test my answer, please give me a feedback.

Collectives™ on Stack Overflow

angular-Js: not able to access array elements in different function call within same controller

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related