Skip to content

Commit

Permalink
Focus first input element when submit error #11
Browse files Browse the repository at this point in the history
  • Loading branch information
@hueitan
hueitan committed Apr 19, 2014
1 parent 46937cc commit 794291d
Show file tree
Hide file tree
Showing 5 changed files with 68 additions and 22 deletions.
43 changes: 33 additions & 10 deletions dist/angular-validation.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -184,9 +184,11 @@
*/
this.validate = function (form) {

var idx = 0;

for (var k in form) {
if (form[k].hasOwnProperty('$dirty')) {
$scope.$broadcast(k + 'submit');
$scope.$broadcast(k + 'submit', idx++);
}
}

Expand Down Expand Up @@ -280,6 +282,8 @@
}
ctrl.$setValidity(ctrl.$name, true);
if (callback) callback();

return true;
};


Expand All @@ -300,9 +304,19 @@
}
ctrl.$setValidity(ctrl.$name, false);
if (callback) callback();

return false;
};


/**
* If var is true, focus element when validate end
* @type {boolean}
***private variable
*/
var isFocusElement = false;


/**
* Check Validation with Function or RegExp
* @param scope
Expand All @@ -319,10 +333,10 @@
expressionType = $validationProvider.getExpression(validation).constructor,
valid = {
success: function () {
validFunc(element, attrs[successMessage], validation, scope.validCallback(), ctrl);
return validFunc(element, attrs[successMessage], validation, scope.validCallback(), ctrl);
},
error: function () {
invalidFunc(element, attrs[errorMessage], validation, scope.invalidCallback(), ctrl);
return invalidFunc(element, attrs[errorMessage], validation, scope.invalidCallback(), ctrl);
}
};

Expand Down Expand Up @@ -399,6 +413,7 @@
*/
watch();

isFocusElement = false;
ctrl.$setViewValue('');
ctrl.$setPristine();
ctrl.$setValidity(ctrl.$name, false);
Expand All @@ -414,10 +429,15 @@
/**
* Click submit form, check the validity when submit
*/
scope.$on(ctrl.$name + 'submit', function () {
var value = element[0].value;
scope.$on(ctrl.$name + 'submit', function (event, index) {
var value = element[0].value,
isValid = false;

checkValidation(scope, element, attrs, ctrl, validation, value);
if (index == 0) {
isFocusElement = false;
}

isValid = checkValidation(scope, element, attrs, ctrl, validation, value);

if (attrs.validMethod === 'submit') {
watch(); // clear previous scope.$watch
Expand All @@ -435,11 +455,16 @@
value = '';
}

checkValidation(scope, element, attrs, ctrl, validation, value);
isValid = checkValidation(scope, element, attrs, ctrl, validation, value);
});

}

// Focus first input element when submit error #11
if (!isFocusElement && !isValid) {
isFocusElement = true;
element[0].focus();
}
});

/**
Expand All @@ -448,9 +473,7 @@
if (attrs.validMethod === 'blur') {
element.bind('blur', function () {
var value = element[0].value;
scope.$apply(function () {
checkValidation(scope, element, attrs, ctrl, validation, value);
});
checkValidation(scope, element, attrs, ctrl, validation, value);
});

return;
Expand Down
2 changes: 1 addition & 1 deletion dist/angular-validation.min.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -184,7 +184,7 @@ <h1>Angular Validation.
<fieldset>
<legend>Form ($submit-only)</legend>
<label>Required</label>
<input type="text" name="emailSubmitOnly" ng-model="form5.required" validator="required" valid-method="submit-only"/>
<input type="text" name="emailRequiredOnly" ng-model="form5.required" validator="required" valid-method="submit-only"/>
<label>Email</label>
<input type="text" name="emailSubmitOnly" ng-model="form5.email" validator="email" valid-method="submit-only"/>
</fieldset>
Expand Down
39 changes: 30 additions & 9 deletions src/directive.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,8 @@
}
ctrl.$setValidity(ctrl.$name, true);
if (callback) callback();

return true;
};


Expand All @@ -43,9 +45,19 @@
}
ctrl.$setValidity(ctrl.$name, false);
if (callback) callback();

return false;
};


/**
* If var is true, focus element when validate end
* @type {boolean}
***private variable
*/
var isFocusElement = false;


/**
* Check Validation with Function or RegExp
* @param scope
Expand All @@ -62,10 +74,10 @@
expressionType = $validationProvider.getExpression(validation).constructor,
valid = {
success: function () {
validFunc(element, attrs[successMessage], validation, scope.validCallback(), ctrl);
return validFunc(element, attrs[successMessage], validation, scope.validCallback(), ctrl);
},
error: function () {
invalidFunc(element, attrs[errorMessage], validation, scope.invalidCallback(), ctrl);
return invalidFunc(element, attrs[errorMessage], validation, scope.invalidCallback(), ctrl);
}
};

Expand Down Expand Up @@ -142,6 +154,7 @@
*/
watch();

isFocusElement = false;
ctrl.$setViewValue('');
ctrl.$setPristine();
ctrl.$setValidity(ctrl.$name, false);
Expand All @@ -157,10 +170,15 @@
/**
* Click submit form, check the validity when submit
*/
scope.$on(ctrl.$name + 'submit', function () {
var value = element[0].value;
scope.$on(ctrl.$name + 'submit', function (event, index) {
var value = element[0].value,
isValid = false;

checkValidation(scope, element, attrs, ctrl, validation, value);
if (index == 0) {
isFocusElement = false;
}

isValid = checkValidation(scope, element, attrs, ctrl, validation, value);

if (attrs.validMethod === 'submit') {
watch(); // clear previous scope.$watch
Expand All @@ -178,11 +196,16 @@
value = '';
}

checkValidation(scope, element, attrs, ctrl, validation, value);
isValid = checkValidation(scope, element, attrs, ctrl, validation, value);
});

}

// Focus first input element when submit error #11
if (!isFocusElement && !isValid) {
isFocusElement = true;
element[0].focus();
}
});

/**
Expand All @@ -191,9 +214,7 @@
if (attrs.validMethod === 'blur') {
element.bind('blur', function () {
var value = element[0].value;
scope.$apply(function () {
checkValidation(scope, element, attrs, ctrl, validation, value);
});
checkValidation(scope, element, attrs, ctrl, validation, value);
});

return;
Expand Down
4 changes: 3 additions & 1 deletion src/provider.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -181,9 +181,11 @@
*/
this.validate = function (form) {

var idx = 0;

for (var k in form) {
if (form[k].hasOwnProperty('$dirty')) {
$scope.$broadcast(k + 'submit');
$scope.$broadcast(k + 'submit', idx++);
}
}

Expand Down

0 comments on commit 794291d

Please sign in to comment.