Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

validation-reset and has-error input #135

Closed
alexgoroshko opened this issue Aug 19, 2015 · 14 comments
Closed

validation-reset and has-error input #135

alexgoroshko opened this issue Aug 19, 2015 · 14 comments

Comments

@alexgoroshko
Copy link

I extended validation provider like that:

image

And then I just put some invalid data to input to get validation error

image

As you see angular validation properly added has-error class to the parent div and added a validation error message.
But when I click reset validation, has-error class appears on the first input and is still on the second one, but error message disappear

image

What am I doing wrong?

@hueitan
Copy link
Owner

hueitan commented Aug 20, 2015

Check your code again. You add and remove class on the element.parent(), might be the parent problem. Check again.

And tell me the result.

@alexgoroshko
Copy link
Author

Just added console.log() to my code snippet:

angular.extend($validationProvider, {
            validCallback: function (element) {
                console.log("validCallback");
                element.parent().removeClass('has-error');
            },
            invalidCallback: function (element) {
                console.log("invalidCallback");
                element.parent().addClass('has-error');
            }
        });

and then I clicked button with validation-reset on it and I've got two invalidCallback events

image

@alexgoroshko
Copy link
Author

Pay attention that these inputs have validators. It seems like validation-reset fires invalidCallback

@hueitan
Copy link
Owner

hueitan commented Aug 20, 2015

Yes you are right.
https://github.com/huei90/angular-validation/blob/master/src/directive.js#L225-L243

The reset will manually remove the value and remove the invalid element, and might trigger the invalidcallback function.

Reset must be clean. This should be improve! Thanks @alexgoroshko

@alexgoroshko
Copy link
Author

But if you make clear reset validation (without events) it won't solve the problem.
So I have such extension

image

It means if there is a validation error so "angular-validation" adds has-error class to parent div (because I need bootstrap red border on invalid input). Then just try to reset validation and it will remove just validation error message and has-error class will be still on div. Have you any ideas how to correctly reset validation, just return to neutral state like it was before validating?

@alexgoroshko
Copy link
Author

Maybe add some reset-validation event where we will be able to set initial state like it's supposed to be before validation.

@hueitan
Copy link
Owner

hueitan commented Aug 20, 2015

Have you tried this when using angular-validation in Bootstrap?
https://github.com/huei90/angular-validation#integrating-with-twitter-bootstrap

@alexgoroshko
Copy link
Author

Yes, I have. I was talking about reset-validation, that if you want to reset form validation where already exist some validation errors it won't fire validCallback and
$(element).parents('.form-group:first').removeClass('has-error');
won't be fired. Is it clear what I mean?

@hueitan
Copy link
Owner

hueitan commented Aug 20, 2015

Yes, i get your point. We need a better and real reset for the form.

@hueitan
Copy link
Owner

hueitan commented Aug 20, 2015

@Nazanin1369 Any opinion on this issue?

@alexgoroshko
Copy link
Author

Even in your demo http://huei90.github.io/angular-validation/ when you just reload the page, input is clear, without ng-invalid class.

image

Then type just something wrong to get validation error. As you see for now input has a ng-invalid class.

image

Then just reset the form. There is nothing happens with input, it's still have all validation error classes

image

@hueitan
Copy link
Owner

hueitan commented Aug 21, 2015

Yes, therefore

We need a better and real reset for the form

@Nazanin1369
Copy link
Collaborator

I will look into it
On Aug 20, 2015 7:24 PM, "Huei Tan" notifications@github.com wrote:

Yes, therefore

We need a better and real reset for the form


Reply to this email directly or view it on GitHub
#135 (comment)
.

@hueitan
Copy link
Owner

hueitan commented Sep 16, 2015

Hi @alexgoroshko
Sorry for the late fix.

The problem is fixed now. Please try again.

Open the issue if needed.

@hueitan hueitan closed this as completed Sep 16, 2015
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants