AngularJS: Empty - latest CI build
HTML
<script src="http://ci.angularjs.org/job/angular.js-vojta/239/artifact/build/pkg/1.0.0rc2-0254075d/angular-1.0.0rc2-0254075d.js"></script>
<div ng-app="my">
<form name="myForm" ng-controller="Ctrl">
<div ng-repeat="item in items">
<input ng-model="item.name" type="text" name="name" unique-in="name" required >
</div>
<p>I would like the form to be invalid if any pair of these items have the same name.</p>
<button ng-click="add()">Add</button>
</form>
</div>
CSS
input.ng-invalid {
background-color: #FA787E;
}
input.ng-valid {
background-color: #78FA89;
}
JavaScript
function Ctrl($scope) {
$scope.add = function() {
$scope.items.push({name: ""});
};
$scope.items = [{name: 'One'},{name:'Two'}];
}
angular.module('my', []).directive('uniqueIn', function() {
return {
require: 'ngModel',
link: function(scope, elm, attrs, ctrl) {
var form = elm.inheritedData('$formController');
ctrl.$parsers.push(function(value) {
// no value - we it's valid (required takes care of it)
if (!value) {
ctrl.$setValidity('unique', true);
return value;
}
// no change - do nothing, keep the validity
if (value === ctrl.$modelValue) {
return value;
}
var unique = true,
controls = form[attrs.uniqueIn];
if (angular.isArray(controls)) {
controls.forEach(function(c) {
if (c.$modelValue === ctrl.$modelValue) {
c.$setValidity('unique', true);
} else if (c.$modelValue === value) {
c.$setValidity('unique', false);
unique = false;
}
});
}
ctrl.$setValidity('unique', unique);
return value;
});
}
};
});