Fixes (and massively simplifies) the member group picker to use the correct way of using checks in tree nodes

src/Umbraco.Web.UI.Client/src/views/common/dialogs/membergrouppicker.controller.js

@@ -3,65 +3,31 @@ angular.module("umbraco").controller("Umbraco.Dialogs.MemberGroupPickerControlle
     function($scope, eventsService, entityResource, searchService, $log) {
         var dialogOptions = $scope.dialogOptions;
         $scope.dialogTreeEventHandler = $({});
-        $scope.results = [];
-        $scope.dialogData = [];
-        
+        $scope.multiPicker = dialogOptions.multiPicker;
+
         /** Method used for selecting a node */
         function select(text, id) {
 
-           
-            $scope.showSearch = false;
-            $scope.results = [];
-            $scope.term = "";
-            $scope.oldTerm = undefined;
-
             if (dialogOptions.multiPicker) {
-                if ($scope.dialogData.indexOf(id) == -1) {
-                    $scope.dialogData.push(id);
-                }
+                $scope.select(id);              
             }
             else {
-                $scope.submit(id);
-               
+                $scope.submit(id);               
             }
         }
         
-        function remove(text, id) {
-            var index = $scope.dialogData.indexOf(id);
-         
-            if (index > -1) {
-                $scope.dialogData.splice(index, 1);
-            }
-        }
-
         function nodeSelectHandler(ev, args) {
             args.event.preventDefault();
             args.event.stopPropagation();
-
-
+            
             eventsService.emit("dialogs.memberGroupPicker.select", args);
             
             //This is a tree node, so we don't have an entity to pass in, it will need to be looked up
             //from the server in this method.
             select(args.node.name, args.node.id);
 
-            if (dialogOptions.multiPicker) {
-                var c = $(args.event.target.parentElement);
-                if (!args.node.selected) {
-                    args.node.selected = true;
-                    c.find("i.umb-tree-icon").hide()
-                        .after("<i class='icon umb-tree-icon sprTree icon-check blue temporary'></i>");
-                }
-                else {
-
-                    remove(args.node.name, args.node.id);
-
-                    args.node.selected = false;
-                    c.find(".temporary").remove();
-                    c.find("i.umb-tree-icon").show();
-                }
-            }
-
+            //toggle checked state
+            args.node.selected = args.node.selected === true ? false : true;
         }
 
         $scope.dialogTreeEventHandler.bind("treeNodeSelect", nodeSelectHandler);

src/Umbraco.Web.UI.Client/src/views/common/dialogs/membergrouppicker.html

@@ -1,15 +1,15 @@
 <div class="umb-panel" ng-controller="Umbraco.Dialogs.MemberGroupPickerController">
 	
     <div class="umb-panel-body with-footer no-header">
-
-
-        <div ng-hide="showSearch">
+        
+        <div>
             <umb-tree section="member"
                       treealias="memberGroup"
                       hideheader="true"
                       hideoptions="true"
                       isdialog="true"
-                      eventhandler="dialogTreeEventHandler">
+                      eventhandler="dialogTreeEventHandler"
+                      enablecheckboxes="{{multiPicker}}">
             </umb-tree>
         </div>
     </div>
@@ -22,12 +22,11 @@
 		        		<localize key="general_cancel">Cancel</localize>
 					</a>
 
-					<button
-						class="btn btn-primary"
-						ng-show="dialogOptions.multiPicker" 
-						ng-click="submit(dialogData)">
-						<localize key="buttons_select">Select</localize>
-					</button>
+                    <button class="btn btn-primary"
+                            ng-click="submit(dialogData.selection)">
+                        <localize key="buttons_select">Select</localize>
+                        ({{dialogData.selection.length}})
+                    </button>
 
 		        </div>
 			</div>

src/Umbraco.Web.UI.Client/src/views/common/dialogs/treepicker.controller.js

@@ -131,7 +131,8 @@ angular.module("umbraco").controller("Umbraco.Dialogs.TreePickerController",
 	                };
 	                $scope.submit(node);
 	            }
-	        } else {
+	        }
+	        else {
 	            
 	            if ($scope.multiPicker) {
 	                $scope.select(id);