Add validating state during async validation

[steph643]

Here is my use case: I created a form element which contains a "Change" button. When clicking this button, a modal dialog pops up, which allows user to choose among values. User choice is validated when user clicks OK to close the dialog.

With the current version of the package, I implemented this using async validation, as described in discussion #36. However here is a separate issue, in case some other ways will be preferred to support this use case.

[jonjamz]

Could you show me an example or walk me through your thought process? I know of several ways to do modals; I'm guessing in this case you used a lib that ran a callback? Another way I could think of would be putting the modal container inside the element itself so you could handle the close event manually.

[steph643]

My modal function is as follow (simplified version):

showBootstrapModal = function (template, data, onClose)

It shows a modal based on a Meteor template and its data context. onClose is called when the dialog is closed.

What I did:

• I created an element containing a button and validationEvent = 'click'
• In validationValue(), I call showBootstrapModal() and return this.stop
• I call this.validate() (if appropriate) in onClose()

(well, in fact I do all this through a modified version of the API described in #36)

[jonjamz]

This is currently the best way to do anything async.

One thing I will add to support this is what I first described in #36, the {{validating}} helper.

And I think if a form has validating state, it shouldn't be able to be submitted. What do you think?

[steph643]

I have to say I cannot achieve async validation the way I want. I will postpone this to a later stage and find another way until then. This is not critical for me.

I don't need a {{validating}} helper, because I use async validation in a modal. So, when the modal is displayed, the form is not visible anyway.

What is lacking right now is:

• a way to attach custom validation to the element from within the form, not when declaring the element (as discussed in Elements should support manual (async) validation #36).
• a way to prevent initial validation, otherwise it shows the dialog immediately when displaying the form (as described in validationValue called when displaying the form #59).

Maybe I am also facing an issue regarding content of this and/or changed in the submit function when doing async validation (see #61). This may or may not be related to SimpleSchema clean function (I need to pass { removeEmptyStrings: false } everywhere, which adds to the complexity).