Merge pull request #6933 from kjac/v8/fix/treepicker-retain-selected-state

V8: Display picked item state when navigating the treepicker

src/Umbraco.Web.UI.Client/src/common/directives/components/umbminilistview.directive.js

@@ -58,7 +58,9 @@
                 
                 entityResource.getPagedChildren(miniListView.node.id, scope.entityType, miniListView.pagination)
                     .then(function (data) {
-
+                        if (scope.onItemsLoaded) {
+                            scope.onItemsLoaded({items: data.items});
+                        }
                         // update children
                         miniListView.children = data.items;
                         _.each(miniListView.children, function(c) {
@@ -208,6 +210,7 @@
                 startNodeId: "=",
                 onSelect: "&",
                 onClose: "&",
+                onItemsLoaded: "&",
                 entityTypeFilter: "="
             },
             link: link

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

@@ -58,6 +58,7 @@ angular.module("umbraco").controller("Umbraco.Editors.TreePickerController",
         vm.hideSearch = hideSearch;
         vm.closeMiniListView = closeMiniListView;
         vm.selectListViewNode = selectListViewNode;
+        vm.listViewItemsLoaded = listViewItemsLoaded;
         vm.submit = submit;
         vm.close = close;
 
@@ -415,7 +416,7 @@ angular.module("umbraco").controller("Umbraco.Editors.TreePickerController",
             if ($scope.model.selection.length > 0) {
                 for (var i = 0; $scope.model.selection.length > i; i++) {
                     var selectedItem = $scope.model.selection[i];
-                    if (selectedItem.id === item.id) {
+                    if (selectedItem.id === parseInt(item.id)) {
                         found = true;
                         foundIndex = i;
                     }
@@ -630,8 +631,8 @@ angular.module("umbraco").controller("Umbraco.Editors.TreePickerController",
             _.each(vm.searchInfo.results,
                 function (result) {
                     var exists = _.find($scope.model.selection,
-                        function (selectedId) {
-                            return result.id == selectedId;
+                        function (item) {
+                            return result.id == item.id;
                         });
                     if (exists) {
                         result.selected = true;
@@ -651,6 +652,15 @@ angular.module("umbraco").controller("Umbraco.Editors.TreePickerController",
             vm.miniListView = undefined;
         }
 
+        function listViewItemsLoaded(items) {
+            var selectedIds = _.pluck($scope.model.selection, "id");
+            _.each(items, function (item) {
+                if (_.contains(selectedIds, item.id)) {
+                    item.selected = true;
+                }
+            });
+        }
+
         function submit(model) {
             if($scope.model.submit) {
                 $scope.model.submit(model);

src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/treepicker/treepicker.html

@@ -75,6 +75,7 @@
                                 start-node-id="vm.startNodeId"
                                 on-select="vm.selectListViewNode(node)"
                                 on-close="vm.closeMiniListView()"
+                                on-items-loaded="vm.listViewItemsLoaded(items)"
                                 entity-type-filter="vm.filter">
                             </umb-mini-list-view>