# How to activate pages in lifecycle events

**URL:** <https://forums.fusetools.com/t/how-to-activate-pages-in-lifecycle-events/6012>\
**Category:** General\
**Created:** [August 16, 2017, 1:27pm UTC](https://forums.fusetools.com/t/how-to-activate-pages-in-lifecycle-events/6012 "2017-08-16T13:27:48Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![operate2v](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/operate2v/32/627_2.png) [@operate2v](https://forums.fusetools.com/u/operate2v)\
**Post date:** [August 16, 2017, 1:27pm UTC](https://forums.fusetools.com/t/how-to-activate-pages-in-lifecycle-events/6012/1 "2017-08-16T13:27:48Z")

</div>

Hello!

When the `enteringBackground` event is performed, I want the function on the current page to be executed.

If the page is page2 when the `enteringBackground` event is performed, I would like to execute the {page2} function.

Even if it is not `Activated Handler`, I want to know if there is a way to do it!

```auto
<App>
    <JavaScript>
    var Lifecycle = require('FuseJS/Lifecycle');
    var Observable = require('FuseJS/Observable');

    Lifecycle.on("enteringForeground", function() {
      console.log("on enteringForeground");
    });
    Lifecycle.on("enteringInteractive", function() {
        console.log("on enteringInteractive");
    });
    Lifecycle.on("exitedInteractive", function() {
        console.log("on exitedInteractive");
    });
    Lifecycle.on("enteringBackground", function() {
        console.log("on enteringBackground");
    });

    function page1() {
      console.log('page1 activated');
    }
    function page2() {
      console.log('page2 activated');
    }

    module.exports = {
      page1, page2
    }
    </JavaScript>

    <DockPanel Placed="{placed}">
        <PageControl>
            <Panel>
                <Activated Handler="{page1}" Path="Local"/>
                <Text Value="page1"/>
            </Panel>
            <Panel>
                <Activated Handler="{page2}" Path="Local"/>
                <Text Value="page2"/>
            </Panel>
        </PageControl>
    </DockPanel>
</App>

```

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [August 16, 2017, 3:19pm UTC](https://forums.fusetools.com/t/how-to-activate-pages-in-lifecycle-events/6012/2 "2017-08-16T15:19:55Z")

</div>

Thank you for taking the time to make a clear, complete, minimal reproduction!

Now, there’s no direct way for you to make the `Activated` trigger pulse upon lifecycle events, so we need to find a way around this. An obvious choice would be tracking the currently active page, so that you can call the necessary function from JavaScript.

I came up with this, based on your code:

```auto
<App>
    <JavaScript>
    var Lifecycle = require('FuseJS/Lifecycle');
    var Observable = require('FuseJS/Observable');

    Lifecycle.on("enteringForeground", function() {
      console.log("on enteringForeground");
    });
    Lifecycle.on("enteringInteractive", function() {
        console.log("on enteringInteractive");
        switch (activeIndex.value) {
            case 0:
                page1();
            break;
            case 1:
                page2();
            break;
            default:
                console.log("unknown active page index: " + activeIndex.value);
            break;
        }
    });
    Lifecycle.on("exitedInteractive", function() {
        console.log("on exitedInteractive");
    });
    Lifecycle.on("enteringBackground", function() {
        console.log("on enteringBackground");
    });

    function page1() {
      console.log("page1 activated");
    }
    function page2() {
      console.log("page2 activated");
    }

    var activeIndex = Observable(0);

    module.exports = {
      page1: page1,
      page2: page2,
      activeIndex: activeIndex
    }
    </JavaScript>

    <DockPanel>
        <PageControl ActiveIndex="{activeIndex}">
            <Panel ux:Name="one">
                <Activated Handler="{page1}" Path="Local"/>
                <Text Value="page1"/>
            </Panel>
            <Panel ux:Name="two">
                <Activated Handler="{page2}" Path="Local"/>
                <Text Value="page2"/>
            </Panel>
        </PageControl>
    </DockPanel>
</App>

```

Hope this helps!

---

<div class="post-metadata">

**Author:** ![operate2v](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/operate2v/32/627_2.png) [@operate2v](https://forums.fusetools.com/u/operate2v)\
**Post date:** [August 17, 2017, 3:06pm UTC](https://forums.fusetools.com/t/how-to-activate-pages-in-lifecycle-events/6012/3 "2017-08-17T15:06:03Z")

</div>

Your advice solved the problem. thank you for helping!