CODEWITHSUNDEEP
javascriptarraysangularjsobjectng-options
Batman
Batman

Reputation: 6353

Moving objects between two arrays

I have two lists formed from an array containing objects. I'm trying to move objects from one list to the other and vice versa.

Controller:

spApp.controller('userCtrl', 
    function userCtrl($scope,userService,groupService){

        //Generate list of all users on the SiteCollection
        $scope.users = userService.getUsers();

            //array of objects selected through the dom
        $scope.selectedAvailableGroups;
        $scope.selectedAssignedGroups;

            //array of objects the user actually belongs to
            $scope.availableGroups;
            $scope.assignedGroups;

        //Generate all groups on the site
        $scope.groups = groupService.getGroups();

        //Boolean used to disable add/remove buttons
        $scope.selectedUser = false;

            //Take the selectedAvailableGroups, add user to those groups
            //so push objects to "assignedGroups" array and remove from "avaiableGroups" array
        $scope.addUserToGroup = function (){
            userService.addUserToGroup($scope.selectedUser, $scope.selectedAvailableGroups, $scope.assignedGroups, $scope.availableGroups)
        };
    }
);

Service: 

spApp.factory('userService', function(){
var addUserToGroup = function (selectedUser, selectedAvailableGroups, assignedGroups, availableGroups) {
    var addPromise = [];
    var selectLength = selectedAvailableGroups.length;

    //Add user to selected groups on server
    for (var i = 0; i < selectLength; i++) {
      addPromise[i] = $().SPServices({
        operation: "AddUserToGroup",
        groupName: selectedAvailableGroups[i].name,
        userLoginName: selectedUser.domain
      });      
    };

    //when all users added, update dom
    $.when.apply($,addPromise).done(function (){
      for (var i = 0; i < selectLength; i++) {
        assignedGroups.push(selectedAvailableGroups[i]);
        availableGroups.pop(selectedAvailableGroups[i]);
      };
      //alert(selectedUser.name + " added to: " + JSON.stringify(selectedAvailableGroups));  
    });
  }
}

Object:

[{ 
id: 85,
name: Dev,
Description:, 
owner: 70,
OwnerIsUser: True
 }]

HTML:

        <div>
            <label for="entityAvailable">Available Groups</label>
            <select id="entityAvailable" multiple   
                ng-model="selectedAvailableGroups" 
                ng-options="g.name for g in availableGroups | orderBy:'name'">
            </select>
        </div>
        <div id="moveButtons" >
            <button type="button" ng-disabled="!selectedUser" ng-click="addUserToGroup()">Add User</button>
            <button type="button" ng-disabled="!selectedUser" ng-click="removeUserFromGroup()">Remove</button>
        </div>
        <div>
            <label for="entityAssigned">Assigned Groups</label>
            <select id="entityAssigned" multiple
                ng-model="selectedAssignedGroups" 
                ng-options="g.name for g in assignedGroups | orderBy:'name'">                       
            </select>
        </div>

Right now, the push into assigned groups works but only updates when I click on something else or in the list, not really dynamically. But the biggest issue is the .pop() which I don't think works as intended.

Upvotes: 0

Views: 618

Answers (1)

michael
michael

Reputation: 16341

$.when.apply($,addPromise).done() seems not to be angular api or synchronous. So angular is not aware of your changes. You must wrap your code inside a $scope.$apply call:

$scope.$apply(function(){
      for (var i = 0; i < selectLength; i++) {
        assignedGroups.push(selectedAvailableGroups[i]);
        availableGroups.pop(selectedAvailableGroups[i]);
      };
});

If you click on something, a $digest loop will happen and you will see your changes.

Your pop did not work because Array.pop only removes the last element. I guess that is not what you want. If you want to remove a specific element you should use Array.splice(),

Upvotes: 1

Related Questions