disable "Add" button in Nested Content config when no available docTypes are left

src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js

@@ -15,6 +15,10 @@
             });
         }
 
+        $scope.canAdd = function () {
+            return !$scope.model.docTypes || !$scope.model.value || $scope.model.value.length < $scope.model.docTypes.length;
+        }
+
         $scope.remove = function (index) {
             $scope.model.value.splice(index, 1);
         }
@@ -58,9 +62,19 @@
         ncResources.getContentTypes().then(function (docTypes) {
             $scope.model.docTypes = docTypes;
 
+            // Count doctype name occurrences
+            var docTypeNameOccurrences = _.countBy(docTypes, 'name');
+            
             // Populate document type tab dictionary
+            // And append alias to name if multiple doctypes have the same name
             docTypes.forEach(function (value) {
                 $scope.docTypeTabs[value.alias] = value.tabs;
+
+                value.displayName = value.name;
+
+                if (docTypeNameOccurrences[value.name] > 1) {
+                    value.displayName += " (" + value.alias + ")";
+                }
             });
         });
 

src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.doctypepicker.html

@@ -23,7 +23,7 @@
                     </td>
                     <td>
                         <select id="{{model.alias}}_doctype_select"
-                            ng-options="dt.alias as dt.name for dt in selectableDocTypesFor(config) | orderBy: 'name'"
+                            ng-options="dt.alias as dt.displayName for dt in selectableDocTypesFor(config) | orderBy: 'name'"
                             ng-model="config.ncAlias" required></select>
                     </td>
                     <td>
@@ -35,17 +35,17 @@
                         <input type="text" ng-model="config.nameTemplate" />
                     </td>
                     <td>
-                        <a class="btn btn-danger" ng-click="remove($index)">
+                        <button type="button" class="btn btn-danger" ng-click="remove($index)">
                             <localize key="general_delete">Delete</localize>
-                        </a>
+                        </button>
                     </td>
                 </tr>
             </tbody>
         </table>
         <div>
-            <a class="btn" ng-click="add()">
+            <button type="button" class="btn" ng-click="add()" ng-disabled="!canAdd()">
                 <localize key="general_add">Add</localize>
-            </a>
+            </button>
             <i class="icon icon-help-alt medium umb-nested-content__help-icon" ng-click="showHelpText = !showHelpText"></i>
         </div>
     </div>