# Trigger some method every time the page is "navigated to"

**URL:** <https://forums.fusetools.com/t/trigger-some-method-every-time-the-page-is-navigated-to/5787>\
**Category:** How-to Discussions\
**Created:** [June 25, 2016, 3:06pm UTC](https://forums.fusetools.com/t/trigger-some-method-every-time-the-page-is-navigated-to/5787 "2016-06-25T15:06:49Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![amilcar](https://avatars.discourse-cdn.com/v4/letter/a/7993a0/32.png) [@amilcar](https://forums.fusetools.com/u/amilcar)\
**Post date:** [June 25, 2016, 3:06pm UTC](https://forums.fusetools.com/t/trigger-some-method-every-time-the-page-is-navigated-to/5787/1 "2016-06-25T15:06:49Z")

</div>

Given something like this:

```auto
<Page ux:Class="NotesEdit">
    <Router ux:Dependency="router" />
    <DockPanel>

        <JavaScript File="NotesEdit.js" />

        <StackPanel>
            <Text Value="{note.date}" />
            <Text Value="{note.description}" />
        </StackPanel>

    </DockPanel>
</Page>

```

I want to make something like this:

```auto
this.onEnter(function(){
    reloadNotes()
})

```

How can I achieve that?

---

<div class="post-metadata">

**Author:** ![Edwin\_Reynoso](https://avatars.discourse-cdn.com/v4/letter/e/e99b99/32.png) [@Edwin\_Reynoso](https://forums.fusetools.com/u/Edwin_Reynoso)\
**Post date:** [June 25, 2016, 3:48pm UTC](https://forums.fusetools.com/t/trigger-some-method-every-time-the-page-is-navigated-to/5787/2 "2016-06-25T15:48:00Z")

</div>

use a `Callback` inside of `WhileActive`:

```auto
<Page>
    <WhileActive>
        <Callback Handler="{functionToCall}" />
    </WhileActive>
    ...
</Page>

```

---

<div class="post-metadata">

**Author:** ![amilcar](https://avatars.discourse-cdn.com/v4/letter/a/7993a0/32.png) [@amilcar](https://forums.fusetools.com/u/amilcar)\
**Post date:** [June 25, 2016, 8:59pm UTC](https://forums.fusetools.com/t/trigger-some-method-every-time-the-page-is-navigated-to/5787/3 "2016-06-25T20:59:43Z")

</div>

Thank you Edwin.

I’m trying to find a way to do this in the JS logic, like the this.onParameterChanged method does, do you know if is even possible ?

Thnks

---

<div class="post-metadata">

**Author:** ![Edwin\_Reynoso](https://avatars.discourse-cdn.com/v4/letter/e/e99b99/32.png) [@Edwin\_Reynoso](https://forums.fusetools.com/u/Edwin_Reynoso)\
**Post date:** [June 25, 2016, 9:22pm UTC](https://forums.fusetools.com/t/trigger-some-method-every-time-the-page-is-navigated-to/5787/4 "2016-06-25T21:22:48Z")

</div>

Just make `NotesEdit.js` expose the callback you want it to call, and when that’s called you know that the page is active.

```auto
<Page>
    <JavaScript>
        var isActive = false;
        module.exports = {
            whenActive: function() {
                isActive = true;
            },
            whenInActive: function() {
                isActive = false;
            }
        }
    </JavaScript>
    <WhileActive>
        <Callback Handler="{whenActive}" />
    </WhileActive>
    <WhileInactive>
        <Callback Handler="{whenInactive}" />
    </WhileInactive>
</Page>

```

You can obviously use an `Observable` as well by just wrapping the false: `Observable(false)` and setting the `isActive.value = true;` and vice versa

Another way that only works with `ux:Class` (Have not tested this):

```auto
<Page>
    <JavaScript>
        this.isActive; // Observable
    </JavaScript>
    <WhileTrue ux:Name="isActive" Value="true" />
    <WhileActive>
        <Change Target="isActive.Value" Target="true" />
    </WhileActive>
</Page>

```

I believe they will be making a `this.onActive`/`this.onActivated` property that you can bind to a function to, just like `this.onParameterChanged`

---

<div class="post-metadata">

**Author:** ![amilcar](https://avatars.discourse-cdn.com/v4/letter/a/7993a0/32.png) [@amilcar](https://forums.fusetools.com/u/amilcar)\
**Post date:** [June 25, 2016, 9:51pm UTC](https://forums.fusetools.com/t/trigger-some-method-every-time-the-page-is-navigated-to/5787/5 "2016-06-25T21:51:32Z")

</div>

> I believe they will be making a `this.onActive`/`this.onActivated` property that you can bind to a function to, just like `this.onParameterChanged`

Perfect, this will be probably what i’m looking for, a way to triger that method without writing in the UX MarkUp. Meanwhile I will implement the other sugestion via `<WhileActive />`. Thanks!

---

<div class="post-metadata">

**Author:** ![Edwin\_Reynoso](https://avatars.discourse-cdn.com/v4/letter/e/e99b99/32.png) [@Edwin\_Reynoso](https://forums.fusetools.com/u/Edwin_Reynoso)\
**Post date:** [June 25, 2016, 9:52pm UTC](https://forums.fusetools.com/t/trigger-some-method-every-time-the-page-is-navigated-to/5787/6 "2016-06-25T21:52:34Z")

</div>

No problem!!

---

<div class="post-metadata">

**Author:** ![amilcar](https://avatars.discourse-cdn.com/v4/letter/a/7993a0/32.png) [@amilcar](https://forums.fusetools.com/u/amilcar)\
**Post date:** [June 26, 2016, 4:05am UTC](https://forums.fusetools.com/t/trigger-some-method-every-time-the-page-is-navigated-to/5787/7 "2016-06-26T04:05:02Z")

</div>

The `<WhileActive />` doesn’t works in separated UX files (using `<Router />`, `<Navigator />` and `<Page ux:Class="NotesEdit" />` with `<NotesEdit />`

Unless someone knows how to trigger the in the separated UX Files, I need to mix this triggers in the MainView UX

```auto
    <Navigator DefaultTemplate="notesFind">

        <NotesFind ux:Template="notesFind" router="router"> <WhileActive>
                <Callback Handler="{findAllNotes}" />
            </WhileActive>
        </NotesFind>

        <NotesEdit ux:Template="notesEdit" router="router"> <WhileActive>
                <Callback Handler="{readSelectedNote}" />
            </WhileActive>
        </NotesEdit>

        <NotesEditAddPhoto ux:Template="notesEditAddPhoto" router="router"> <WhileActive>
                <Callback Handler="{readSelectedNote}" />
            </WhileActive >
        </NotesEditAddPhoto>

    </Navigator>

```

Thnks.

---

<div class="post-metadata">

**Author:** ![Edwin\_Reynoso](https://avatars.discourse-cdn.com/v4/letter/e/e99b99/32.png) [@Edwin\_Reynoso](https://forums.fusetools.com/u/Edwin_Reynoso)\
**Post date:** [June 26, 2016, 6:18am UTC](https://forums.fusetools.com/t/trigger-some-method-every-time-the-page-is-navigated-to/5787/8 "2016-06-26T06:18:24Z")

</div>

Try adding the `WhileActive` inside the class itself, yet that should work

---

<div class="post-metadata">

**Author:** ![amilcar](https://avatars.discourse-cdn.com/v4/letter/a/7993a0/32.png) [@amilcar](https://forums.fusetools.com/u/amilcar)\
**Post date:** [June 26, 2016, 6:31am UTC](https://forums.fusetools.com/t/trigger-some-method-every-time-the-page-is-navigated-to/5787/9 "2016-06-26T06:31:13Z")

</div>

Inside the class is not working only directly in the “instance” (the markup in the mainview).

Tomorrow I will post my example (working and not working) so anyone can take a look.

Thanks!