Component refresh when switching between edit and preview mode | Community
Skip to main content
dries.vanbilloen
Level 2
Dec 27, 2018 8:26 PM UTC
Solved

Component refresh when switching between edit and preview mode

Hi all,

We recently had an upgrade from AEM 6.1 to AEM 6.3 SP3 and now we are evaluating the different custom components and see how they are in the touch UI.

One thing that we noticed is that there is no refresh when switching between Edit and Preview mode in the touch UI, while the classic UI does.

We used this refresh to switch styles because the classic Ui is sometimes very messy.

Is there some way to fix the switch between the 2 wcmmodes (I already tried the solution in javascript described here: AEM6.3 - force page refresh when change mode to preview on touch ui  , but it doesn't work)?

Thanks in advance!

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
arunpatidar
arunpatidarAccepted solution
New Participant
Dec 28, 2018 7:13 AM UTC

Hi,

You can create clientlibs of category and add cq.authoring.dialog below code.

This code only works when you click on edit and preview button and Edit button inside popover

(function($, $document) {

    "use strict";

    $(document).on("click", ".editor-GlobalBar-previewTrigger", function(e) {

    window.location.reload();

    });

    $('.editor-GlobalBar-item[data-layer="Edit"]').on("click", function(e) {

    window.location.reload();

    });

    $(document).on("click", ".coral-BasicList-item.js-editor-LayerSwitcherTrigger", function(e) {

        if($(this).data("layer")=="Edit")

        {

            window.location.reload();

        }

    });

})($, $(document));

Arun Patidar
View reply

5 replies

arunpatidar
arunpatidar
New Participant
Aug 23, 2019 10:48 PM UTC

because it may not be loading if other categories are not being used.

But why you need to load with another category.

If the script is getting loaded in proper order it should work.

Translate
Arun Patidar
ajinkayk6258253
ajinkayk6258253
Level 3
Aug 23, 2019 7:03 PM UTC

Hi arun, code is not working for categories other than cq.authoring.dialog ? Any Reason.

Translate
dries.vanbilloenAuthor
Level 2
Jan 8, 2019 12:59 PM UTC

You code gave me an idea on how to solve it. I tried your code at first (with some minor changes). This didn't work because apparently the project i'm working on has an Iframe to wrap its content. I had to add a line of code to reach the buttons in Javascript. But the concept stayed the same.

I had to use the parent.document.getElementsByClassName()

Thanks for the idea!

Translate
arunpatidar
arunpatidarAccepted solution
New Participant
Dec 28, 2018 7:13 AM UTC

Hi,

You can create clientlibs of category and add cq.authoring.dialog below code.

This code only works when you click on edit and preview button and Edit button inside popover

(function($, $document) {

    "use strict";

    $(document).on("click", ".editor-GlobalBar-previewTrigger", function(e) {

    window.location.reload();

    });

    $('.editor-GlobalBar-item[data-layer="Edit"]').on("click", function(e) {

    window.location.reload();

    });

    $(document).on("click", ".coral-BasicList-item.js-editor-LayerSwitcherTrigger", function(e) {

        if($(this).data("layer")=="Edit")

        {

            window.location.reload();

        }

    });

})($, $(document));

Translate
Arun Patidar
    smacdonald2008
    smacdonald2008
    Level 10
    Dec 28, 2018 1:45 AM UTC

    AEM OOTB does not support this. As Praveen suggests in the other thread - you need to use script to do this.

    Translate
    Terms & ConditionsAccessibility statement

    Loading footer...