Validation Summary and preValidateFormElements

[mwagnurr]

Because I want to display my validation messages summarized on the top of my page, instead of at the input field, I am trying to use Validation Summary for this purpose.

The problem is that the Validation Summary is already filled on page load, even though it should be deactivated in the global options:
// pre-validate all form elements (False by default)
preValidateFormElements: false

And of course I don't want to present the user with a huge list of Validation errors before he even started to type anything.

Is it intended that this preValidate option doesn't affect ValidationSummary?
Or maybe I am missing something?

Another approach for me would be to write my own summarization with DisplayErrorTo.

[ghiscoding]

Hello, the preValidateFormElements has no effect on Validation Summary. The use of it is to pre-validate all the elements of the form instead of waiting for user to type. By default, when you load the page, nothing is validated, except for the Validation Summary always being filled. I certainly don't like displaying all the errors to the user when he goes on the page and so I don't do pre-validate but in some cases you do want to do that and so that option was made for that usage. If you go in the Plunker Demo and choose the page "2 Forms", you will see that in play.

To my understanding, the data of the Validation Summary is always there no matter what. So basically, I don't have the option that you are looking for. I might be missing that option but at this point it's not available.

As for displayErrorTo, it is meant for sending the error in a different that might not be directly under the input. I made this because I use Bootstrap and it's using so many wrappers that my error display were all wrong.
You also have to note that this is made for 1 input, not multiple. Basically, when using this displayErrorTo, it will overwrite whatever text was previously in the html element you are sending it to. So I don't think your approach would work using displayErrorTo

[mwagnurr]

Thank you for responding.

I see, I initially expected the validations in the Validation Summary to behave the same as those on the input fields (e.g. the options affecting them, like preValidateFormElements or Debounce)

I found a short workaround for my problem described above to simply add:
<div ng-repeat="item in form.$validationSummary" ng-show="form.{{item.field}}.$touched">

But I changed now my approach to the form validation to only show validations after the user pressed the submit button (because of wishes of the designer), where $validationSummary seems to provide a good way to achieve that.

[ghiscoding]

I might eventually add a new Global Options, something like preValidateInValidationSummary and make it True by default so that is doesn't affect other users. In your case, you would make it False to do what you wish for. The name preValidateInValidationSummary might not be the best, if you have another suggestions then please let me know.

I guess that I could add that in a few days when I get a little bit of free time.

[ghiscoding]

Added a new Global Option named preValidateValidationSummary, set to True by default (not to affect anyone's code). Basically, to answer your original request, you would put this new option to False. I would also suggest you to use it in combo with the hideErrorUnderInputs option to True, so that you only have the Validation Summary without any messages under each inputs.

Your code could look like this:

var vs = new validationService({ 
    hideErrorUnderInputs: true, 
    preValidateValidationSummary: false 
});

[mwagnurr]

Thanks a lot for the change!