yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changed validation for NestedContent, allow for pasting many items, but do not allow to save them.

Browse Source
This commit is contained in:
Niels Lyngsø
2019-10-30 10:49:34 +01:00
parent 0e308e1ad0
commit c86b63f7fd
6 changed files with 55 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less
View File

@@ -1,5 +1,4 @@
.umb-nested-content {
text-align: center;
position: relative;
}
@@ -170,6 +169,7 @@
.umb-nested-content__add-content {
display: flex;
width: 100%;
align-items: center;
justify-content: center;
border: 1px dashed @ui-action-discreet-border;

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

@@ -367,10 +367,6 @@ angular.module("umbraco").controller("Umbraco.PropertyEditors.NestedContent.Prop
updateModel();
};
$scope.requestDeleteNode = function (idx) {
if ($scope.nodes.length <= $scope.model.config.minItems) {
return;
}
if ($scope.model.config.confirmDeletes === true) {
localizationService.localizeMany(["content_nestedContentDeleteItem", "general_delete", "general_cancel", "contentTypeEditor_yesDelete"]).then(function (data) {
const overlay = {
@@ -599,8 +595,8 @@ angular.module("umbraco").controller("Umbraco.PropertyEditors.NestedContent.Prop
}
}
// Enforce min items
if ($scope.nodes.length < $scope.model.config.minItems) {
// Auto-fill with elementTypes, but only if we have one type to choose from, and if this property is empty.
if ($scope.singleMode === true && $scope.nodes.length === 0 && $scope.model.config.minItems > 0) {
for (var i = $scope.nodes.length; i < $scope.model.config.minItems; i++) {
$scope.addNode($scope.scaffolds[0].contentTypeAlias);
}
@@ -714,8 +710,31 @@ angular.module("umbraco").controller("Umbraco.PropertyEditors.NestedContent.Prop
updateModel();
});
var watcher = $scope.$watch(
function () {
return $scope.nodes.length;
},
function () {
//Validate!
if ($scope.nodes.length < $scope.minItems) {
$scope.nestedContentForm.minCount.$setValidity("minCount", false);
}
else {
$scope.nestedContentForm.minCount.$setValidity("minCount", true);
}
if ($scope.nodes.length > $scope.maxItems) {
$scope.nestedContentForm.maxCount.$setValidity("maxCount", false);
}
else {
$scope.nestedContentForm.maxCount.$setValidity("maxCount", true);
}
}
);
$scope.$on("$destroy", function () {
unsubscribe();
watcher();
});
}

26
src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.html
View File

@@ -4,7 +4,7 @@
<umb-load-indicator ng-if="!inited"></umb-load-indicator>
<ng-form ng-if="inited">
<ng-form name="nestedContentForm">
<div class="umb-nested-content__items" ng-hide="nodes.length === 0" ui-sortable="sortableOptions" ng-model="nodes">
@@ -18,7 +18,7 @@
<a class="umb-nested-content__icon umb-nested-content__icon--copy" title="{{copyIconTitle}}" ng-click="clickCopy($event, node);" ng-if="showCopy" prevent-default>
<i class="icon icon-documents"></i>
</a>
<a class="umb-nested-content__icon umb-nested-content__icon--delete" localize="title" title="general_delete" ng-class="{ 'umb-nested-content__icon--disabled': $parent.nodes.length <= $parent.minItems }" ng-click="$parent.requestDeleteNode($index); $event.stopPropagation();" prevent-default>
<a class="umb-nested-content__icon umb-nested-content__icon--delete" localize="title" title="general_delete" ng-click="$parent.requestDeleteNode($index); $event.stopPropagation();" prevent-default>
<i class="icon icon-trash"></i>
</a>
</div>
@@ -38,10 +38,26 @@
</div>
</div>
<div class="umb-nested-content__footer-bar" ng-hide="hasContentTypes === false || nodes.length >= maxItems">
<a href class="umb-nested-content__add-content" ng-class="{ '--disabled': !scaffolds.length }" ng-click="openNodeTypePicker($event)" prevent-default>
<div class="umb-nested-content__footer-bar" ng-hide="hasContentTypes === false">
<button class="btn-reset umb-nested-content__add-content umb-focus" ng-class="{ '--disabled': (!scaffolds.length || nodes.length >= maxItems) }" ng-click="openNodeTypePicker($event)" prevent-default>
<localize key="grid_addElement"></localize>
</a>
</button>
</div>
<!--These are here because we need ng-form fields to validate against-->
<input type="hidden" name="minCount" ng-model="nodes" />
<input type="hidden" name="maxCount" ng-model="nodes" />
<div ng-messages="nestedContentForm.minCount.$error" show-validation-on-submit>
<div class="help-inline" ng-message="minCount">
<localize key="validation_entriesShort" tokens="[minItems, minItems - nodes.length]" watch-tokens="true">Minimum %0% entries, needs <strong>%1%</strong> more.</localize>
</div>
</div>
<div ng-messages="nestedContentForm.maxCount.$error" show-validation-on-submit>
<div class="help-inline" ng-message="maxCount">
<localize key="validation_entriesExceed" tokens="[maxItems, nodes.length - maxItems]" watch-tokens="true">Maximum %0% entries, <strong>%1%</strong> too many.</localize>
</div>
</div>
</ng-form>