-
Notifications
You must be signed in to change notification settings - Fork 57
Isolated Scope
Since version 1.3.27+
When you have an isolated scope or when you simply do not know which scope holds your complete Form object. This is especially true when you create a dynamic Form or when you create a Form inside a Modal Window.
The problem is more obvious when you want to run the checkFormValidity()
or get the $validationSummary
.
The way to go around this is to alternatively pass your own isolated scope to the Angular-Validation through the global options as shown below. Then after that, you could even use $compileProvider.debugInfoEnabled(false);
without any problems.
####Directive Change the Angular-Validation default options inside your controller with the isolated, for example a Modal Window Controller
myApp.controller('ModalCtrl', function ($modalInstance, $scope) {
// Modal Window uses it's own isolate scope, so pass it to Angular-Validation
// this will make the $validationSummary and checkFormValidity() to work properly
$scope.$validationOptions = { isolatedScope: $scope };
// now calling the checkFormValidity() is possible
$scope.save = function() {
if(new validationService().checkFormValidity($scope.form1)) {
// proceed with submit
}
}
});
####Service From the Service you can also change it the following way. P.S. This only works when all your elements have been defined by the Angular-Validation Service
myApp.controller('ModalCtrl', function ($modalInstance, $scope) {
// start by creating the service
var myValidation = new validationService();
// define the scope and isolatedScope, the scope property always needs to be there
myValidation.setGlobalOptions({ scope: $scope, isolatedScope: $scope });
// for the Service you could also directly use the scope property
// so this would also work and is equivalent
myValidation.setGlobalOptions({ scope: $scope });
// now calling the checkFormValidity() is possible
$scope.save = function() {
if(new validationService().checkFormValidity($scope.form1)) {
// proceed with submit
}
}
});
#####Special Note
This is kind of a hack, in most cases, passing the isolated scope might actually not be the real scope where your Form is declared, and in that case this hack will work but then showing the $scope.form1
in the console will present you with an object that does not hold much, it has the $validationSummary
and the $name
and a specialNote
saying that this was created by the Angular-Validation. Something like:
$scope.form1: { $name: "form1", $validationSummary: [], specialNote: "Created by Angular-Validation...." }
All that to say, the hack makes this possible without any problems, go ahead use it, but please take in consideration that it was added specifically for $validationSummary
and checkFormValidity()
and of course the Angular-Validation
itself... but please do not post any issues saying that the form object does not hold this or that, I know about it and it's normal behavior.
Contents
- Angular-Validation Wiki
- Installation
- Demo
- Code Samples
- Functionalities
- Custom Validations
- Properties & Options
- Validators
- Tests
- Misc