Expand my Community achievements bar.

SOLVED

Any OOTB timeout component

Avatar

Level 2

I am wondering is there any OOTB timeout component for Adaptive forms (AEM 6.3 forms)?

our ask is if adaptive form is open with out any activity for 13 mins then we should open time out popup , after two mins we should redirect to home page.  Am looking if there is any OOTB component which  can be extended or reused ?

Thanks,

Chandra

1 Accepted Solution

Avatar

Correct answer by
Employee Advisor

No OOTB component available for such use case, but should be easily achievable via JS.

One example can be handling events on form initialize and adding to the Timer based on the Events :

var timeoutID;

function setup() {

    this.addEventListener("mousemove", resetTimer, false);

    this.addEventListener("mousedown", resetTimer, false);

    this.addEventListener("keypress", resetTimer, false);

    this.addEventListener("DOMMouseScroll", resetTimer, false);

    this.addEventListener("touchmove", resetTimer, false);

    this.addEventListener("MSPointerMove", resetTimer, false);

    startTimer();

}

setup();

function startTimer() {

    // wait 10 seconds before calling goInactive

    timeoutID = window.setTimeout(goInactive, 10000);

}

function resetTimer(e) {

    window.clearTimeout(timeoutID);

    goActive();

}

function goInactive() {

    alert("you will be taken to home page");

//do something again

window.location.href = "http://localhost:4502/content/forms/af/test.html";

}

function goActive() {

       // do something

       

    startTimer();

}

View solution in original post

2 Replies

Avatar

Level 10

I do not believe there is for AEM forms. For this use case - you would need to build a custom component. For example, such a component could be implemented using JQUERY - jQuery setTimeout() Function Examples — SitePoint

Avatar

Correct answer by
Employee Advisor

No OOTB component available for such use case, but should be easily achievable via JS.

One example can be handling events on form initialize and adding to the Timer based on the Events :

var timeoutID;

function setup() {

    this.addEventListener("mousemove", resetTimer, false);

    this.addEventListener("mousedown", resetTimer, false);

    this.addEventListener("keypress", resetTimer, false);

    this.addEventListener("DOMMouseScroll", resetTimer, false);

    this.addEventListener("touchmove", resetTimer, false);

    this.addEventListener("MSPointerMove", resetTimer, false);

    startTimer();

}

setup();

function startTimer() {

    // wait 10 seconds before calling goInactive

    timeoutID = window.setTimeout(goInactive, 10000);

}

function resetTimer(e) {

    window.clearTimeout(timeoutID);

    goActive();

}

function goInactive() {

    alert("you will be taken to home page");

//do something again

window.location.href = "http://localhost:4502/content/forms/af/test.html";

}

function goActive() {

       // do something

       

    startTimer();

}