Hi Natallia, I cannot get your point about " stylize button during the form submission". Please elaborate so I can help you. Thank you.

• Default FormElement look and feel is contained in the EPiServerForms.css (embbed in the DLL). You can turn it off (go to Forms.config, set injectFormOwnStylesheet="false")
• You can tweak and reuse the default stylesheet by modifying the EPiServerForms.less, and recompile to .css as you wish.

Hi, everybody!

I believe that what Natallia is talking about is that there is a need to change a Submit button (after user clicks it) by adding an animation picture indicating that the submition data is being sent. 

The style of submit button is changed by 'formsStartSubmitting' handler, but since the data is sent with AJAX async false mode, Chrome is blocked until the ajax call is done. Thus, the animation is not visible.

THACH, I was wondering, if there is any workaround to overcome this? Is there any possibility that in some coming version of the Forms the ajax call would become asynchronous? 

@Igor

I cannot assure 100%, we cannot ship it hastily, If you send me your example (code with formsStartSubmitting), I try to change it before we ship Forms 3.

For changing default behaviour (async: false), It will consider configuration value in epi.EPiServer.Forms object.

In $(document).ready  We call addActiveClass:

function addActiveClass() {
    if (typeof $$epiforms !== 'undefined') {
        $$epiforms(document).ready(function myfunction() {
        $$epiforms(".EPiServerForms").on("formsStartSubmitting",
            function () {
                               $(this).find(".FormSubmitButton").addClass("active");
            });
        $$epiforms(".EPiServerForms").on("formsSubmitted",
            function () {
                               $(this).find(".FormSubmitButton").removeClass("active");
           });
       });
    }
}

the 'active' class adds a 'spinner' image to Submit button:

    ...
background-image: url("../img/spinner.gif");

    ...

}

The image is rendered only in FireFox. Chrome is blocked and renders only after the ajax call completes.

I file Story AFORM-742 for it. It will be in Forms 3.0

In order to make Form use $.ajax() to submit form asynchronously, Developer can do either of this:

Thank you all for the help.