AngularJS Firebase database update a field by checkbox

Question

I want to update the data in a table which displays Firebase database.

Each line in the table represents one particular user's data. My goal is to be able to update the data in one field of a user data. In this example, I am trying to change the user role based on a checkbox ng-true-value="'admin'" ng-false-value="'user'".

How can I get the user id of the line I am editing/updating the info and pass it into the update function? currently the code is taking the current user ID.

the function I use it update user info is:

$scope.updateRole= function () {

            var updated_user_info= {
                role: $scope.user.role

            };
            var myuser = firebase.auth().currentUser;//change this part?!
            DatabaseRef.ref('users/' + myuser.uid).update(updated_user_info)
                .then(function () {
                    console.log("update success");
                }).catch(function (error) {
                $scope.errMsg = true;
                $scope.errorMessage = error.message;
            });
        }

the html view:

<tr ng-repeat="obj in $data">   
    <td data-title="'First Name'" filter="{ 'First Name': 'text' }" sortable="'firstName'">{{ obj.firstName }}</td>
    <td data-title="'Last Name'" filter="{ 'Last Name': 'text' }" sortable="'lastName'">{{ obj.lastName }}</td>
    <td data-title="'Role'" filter="{ 'Role': 'text' }" sortable="'role'">
        <input type="checkbox" ng-model="user.role" ng-true-value="'admin'" ng-false-value="'user'" ng-click="updateRole()">
        {{obj.role}}
    </td>
</tr>

currently it is updating only the current user, and also maintaining a checked value for all users, but not updating, only the current user itself.

Answer 1

If i was you i would use the ng-change directive instead of ng-click. The ng-change directive triggers everytime the checkbox value changes.

HTML

<input type="checkbox" ng-model="user.role" ng-change="updateRole(user)" ng-true-value="'admin'" ng-false-value="'user'">

As you can see on the HTML above we can pass the user model to our updateRole function and handle the rest from there.

JS

$scope.updateRole= function (user) {
   var updated_user_info= {
       role: user.role
   };

  DatabaseRef.ref('users/' + user.uid).update(updated_user_info)
      .then(function () {
          console.log("update success");
      }).catch(function (error) {
      $scope.errMsg = true;
      $scope.errorMessage = error.message;
  });

}

As you can see your update function has changed a bit. Now you can get the uid from the user object and go on.

Answer 2

That is because you are referring to the current user on any update you do to the database DatabaseRef.ref('users/' + myuser.uid).update(updated_user_info) you are updating the same user all the time, you need to get the id from the user you want to update. something like this:

<td data-title="'Role'" filter="{ 'Role': 'text' }" sortable="'role'">
    <input type="checkbox" ng-model="user.role" ng-true-value="'admin'" ng-false-value="'user'" ng-click="updateRole(obj.uid)">
    {{obj.role}}
</td>

And receive the id in your function

$scope.updateRole= function (userid) {

        var updated_user_info= {
            role: $scope.user.role

        };
        DatabaseRef.ref('users/' + userid).update(updated_user_info)
            .then(function () {
                console.log("update success");
            }).catch(function (error) {
            $scope.errMsg = true;
            $scope.errorMessage = error.message;
        });
    }

Answer 3

As stated in another answer, it's because you're only ever updating one user. You already have the user that you want to update with the 'obj' from your ng-repeat, so there's no need to call the database again to get the user you want to update.

From Firebase's docs: "You can also get the currently signed-in user by using the currentUser property." By this logic, the current user is always going to be the one that is editing the checkbox, and I'm sure you don't want users to make themselves admins.

<input type="checkbox" ng-model="user.role" 
ng-true-value="'admin'" ng-false-value="'user'" ng-click="updateRole(obj.uid)">

And your js should look like

$scope.updateRole = function(userId) {
    var updated_user_info= {
            role: $scope.user.role

        };

        DatabaseRef.ref('users/' + userId).update(updated_user_info)
            .then(function () {
                console.log("update success");
            }).catch(function (error) {
            $scope.errMsg = true;
            $scope.errorMessage = error.message;
        });
    }
}