AEM6.3 - force page refresh when change mode to preview on touch ui | Community
Skip to main content
elizabethp60981
elizabethp60981
New Participant
March 26, 2018
Solved

AEM6.3 - force page refresh when change mode to preview on touch ui

  • March 26, 2018
  • 4 replies
  • 3858 views

Hi,

Each component dragged and dropped on my page goes inside a bootstrap collapsable, so I have to refresh the page to update the scripts.

Is there a way to force page refresh when the user goes to preview mode?

I was seeing some similar problems with solutions to classic UI, but I couldn't find nothing that applies to touch UI.

Is there a way?

Thank you in advance.

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
    Best answer by edubey

    Unfortunately product does have such thing yet. but you can use below script to achieve this

    (function ($, $document) {
        // Adding action on layer
        $document.on('cq-layer-activated', refreshPage);
        function refreshPage(ev) {
            try {
                // Get edit mode page iframe reference
                var iframe = document.getElementById('ContentFrame');
                var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
                // Refresh only if both layers are different and they are either 'Preview' or 'Edit'
                if ((ev.prevLayer === "Preview" && ev.layer === "Edit") || (ev.prevLayer === "Edit" && ev.layer === "Preview")) {
                    window.location.reload();
                }
            } catch (e) {
                console.log("Error occurred while refreshing the page");
            }
        }
    }(jQuery, jQuery(document)));

    4 replies

    elizabethp60981
    elizabethp60981Author
    New Participant
    May 11, 2018

    You should place the script on the clientlibs of the page that you use to overlay the wcm/foundation/components/page (the page that you have this path as sling:resourceSuperType)

    Y
    yguo
    New Participant
    May 11, 2018

    where should I place the script?

    elizabethp60981
    elizabethp60981Author
    New Participant
    March 26, 2018

    This resolves my problem!

    Thank you very much!

    edubey
    edubeyAccepted solution
    New Participant
    March 26, 2018

    Unfortunately product does have such thing yet. but you can use below script to achieve this

    (function ($, $document) {
        // Adding action on layer
        $document.on('cq-layer-activated', refreshPage);
        function refreshPage(ev) {
            try {
                // Get edit mode page iframe reference
                var iframe = document.getElementById('ContentFrame');
                var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
                // Refresh only if both layers are different and they are either 'Preview' or 'Edit'
                if ((ev.prevLayer === "Preview" && ev.layer === "Edit") || (ev.prevLayer === "Edit" && ev.layer === "Preview")) {
                    window.location.reload();
                }
            } catch (e) {
                console.log("Error occurred while refreshing the page");
            }
        }
    }(jQuery, jQuery(document)));
      Terms & ConditionsAccessibility statement

      Loading footer...