Expand my Community achievements bar.

SOLVED

How to display Saving when click the Create button if not finish?

Avatar

Level 4

Hi,

When I create a property page, input the content and click the Create button. The aem save very slow, the user don't understand it saving. So they click again on the Create button. After that the aem save two time and the content is duplicate (it create two page content). I want to display the gif file (example Saving or Creating) it will showing when click on the Create button for the user know and waiting for create finish.

How to do that?

Thanks & Best regards,

BienHV

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Below code should work:

Clientlib category - granite.ui.coral.foundation

/* JS Code  to disable create button*/

(function(document, $) {

  $( document ).ready(function() {

        console.log( "ready!" );

        var formSelector = "form.cq-siteadmin-admin-createpage";

        var selector = "form.cq-siteadmin-admin-createpage .foundation-layout-wizard2-header .coral-Panel button[type=submit]";

        var selectorBtn = "coral-dialog.coral-Dialog.coral-Dialog--success.is-open>div.coral-Dialog-wrapper>coral-dialog-footer>button";

       

        $(formSelector).on('submit', function() {

            $(selector).attr("disabled", "disabled");

            console.log("button disabled");

        });

        $("body").on('click', selectorBtn, function() {

            $(selector).removeAttr("disabled");

            console.log("button enabled");

        });

    });

})(document, Granite.$);



Arun Patidar

View solution in original post

5 Replies

Avatar

Community Advisor

Hi,

You can disabled Create button once clicked and enable it again as soon as page created and OOTB popup displayed.

in popup there are two buttons, open and done. on click of any button you can enabled create button again. Thats how you can prevent duplicate page creation.



Arun Patidar

Avatar

Level 4

Last week I tried disabled Create button when clicked and enabled it again as soon as page created. However, it work fine with save button, but it not right for Create button.

Avatar

Community Advisor

I'll try same and get back to you.



Arun Patidar

Avatar

Level 4

Thanks you,

I am hearing from you.

Avatar

Correct answer by
Community Advisor

Below code should work:

Clientlib category - granite.ui.coral.foundation

/* JS Code  to disable create button*/

(function(document, $) {

  $( document ).ready(function() {

        console.log( "ready!" );

        var formSelector = "form.cq-siteadmin-admin-createpage";

        var selector = "form.cq-siteadmin-admin-createpage .foundation-layout-wizard2-header .coral-Panel button[type=submit]";

        var selectorBtn = "coral-dialog.coral-Dialog.coral-Dialog--success.is-open>div.coral-Dialog-wrapper>coral-dialog-footer>button";

       

        $(formSelector).on('submit', function() {

            $(selector).attr("disabled", "disabled");

            console.log("button disabled");

        });

        $("body").on('click', selectorBtn, function() {

            $(selector).removeAttr("disabled");

            console.log("button enabled");

        });

    });

})(document, Granite.$);



Arun Patidar